Search code examples
jqueryasp.netimpromptu

Internet Explorer cannot display the webpage after using Jquery?


In my asp web app i am making dialog box by impromptu jquery. In my first 3 attempt of clicking submit button the page works well after the onclick event was triggered but on the next attempt the page always show Internet Explorer cannot display the webpage. Maybe i have a problem in executing jquery..

  <asp:Content ID="Content1" ContentPlaceHolderID="head"
        runat="server">
    <script type="text/javascript" language="javascript">
       //Update PartNumber
            function confirmSubmitUpdatePartNumber() {
                $.prompt('Are you sure you want to Update this PartNumber?'
                , {
                    buttons: { Ok: true, Cancel: false }
                    , callback: confirmSubmitResultUpdatePartNumber
                }
            );
                return false;
            }
            function confirmSubmitResultUpdatePartNumber(v, m, f) {
                if (v) //post back if the user clicked OK
                    $('#ctl00_mainContentPlaceholder_btnPartNumber').click();
            }
        </script>  
    </asp:Content>

 <asp:Content ID="detailContent" ContentPlaceHolderID="mainContentPlaceholder"
    runat="server">   

      <input type="button" onclick="return confirmSubmitUpdatePartNumber();"  value="Update PartNumber Location" />   
       <asp:Button ID="btnPartNumber" runat="server" Style="display: none;" 
              onclick="btnPartNumber_Click"/>
</div>

Solution

    1. You don't want to be doing it onclick, you want to use $.submit (in case users hit enter instead of clicking). Not all users have a mouse to click with, so you're making your website inaccessible, which is Very Bad Practice.

    2. You want to avoid inline javascript. Put it in an external script file, and put all your scripts in one file.

    3. Once you're using $('#form').submit(function() {}); you can do your prompt test, and either return true (to submit it) or return false (if they click cancel). Then you don't need the confirmSubmitResultUpdatePartNumber function at all, you've shortened your code and cleaned it up. You can also remove the extra button and display the submit button, which makes your HTML more semantic.

    Overall, you should be using better coding practices. Try having a look at the HTML5BoilerPlate docs: http://html5boilerplate.com/docs/#Make-it-Better

    You would benefit from using Firefox with Firebug for debugging, rather than IE. Then you can look in the console to see if anything is breaking. You can also add useful alerts in the console to see where your script gets to: console.log("I've made it this far");

    Good luck!