CODEWITHSUNDEEP
javascriptjqueryasp.net
mastermind
mastermind

Reputation: 11

Jquery is not working with Master Page using ASP.NET C#

This code works fine in .aspx page no issues. but if i use master page then nothing works fine here,i tried placing the JQuery script in Master page, even then nothing is working. is there any thing setting need to be done here. Still not getting why info div is not loading count. Below is the link

<script type="text/javascript" src="scripts/jquery-1.3.2-vsdoc2.js"></script>

I refer following blog also:

http://mwtech.blogspot.co.il/2009/04/2-ways-to-load-jquery-from-aspnet.html

MasterPage.master code:

 <head runat="server">
<title></title>

   <script type="text/javascript" src="scripts/jquery-1.3.2-vsdoc2.js">          </script>



<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>


<form id="form1" runat="server">

 <div>
    <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">

    </asp:ContentPlaceHolder>
</div>

</form>

</body>

</html>

Default2.aspx code

 <script type="text/javascript">

     var Editor1 = '#Editor1';
     var Editor1CountLimit = 50
     var Editor1InfoArea = '#Info';

     var Editor2 = '#Editor2';
     var Editor1InfoArea1 = '#Info1';

     $(document).ready(function () {
         TrackCharacterCount(Editor1, Editor1CountLimit, Editor1InfoArea);
         TrackCharacterCount(Editor2, Editor1CountLimit, Editor1InfoArea1);
     });

     function TrackCharacterCount(ctl, limit, info) {
         var editor = $(ctl).contents().find('iframe').eq(2);
         $(editor).load(function () {
             var txt = $(this).contents().find('body').text();
             $(info).html(txt.length); //set initial value 
             $(this).contents().keyup(function () {
                 var txt = $(this).contents().find('body').text();

                 if (txt.length > limit)
                     $(info).html(txt.length).css("color", "red");
                 else
                     $(info).html(txt.length).css("color", "");
             });
         });
     }

     function ValidateEditor1Length(source, args) {
         var editor = $(Editor1).contents().find('iframe').eq(2);
         var txt = editor.contents().find('body').text();
         var isValid = txt.length > 0 && txt.length <= Editor1CountLimit;
         args.IsValid = isValid;
     }


     function ValidateEditor1Length1(source, args) {
         var editor = $(Editor2).contents().find('iframe').eq(2);
         var txt = editor.contents().find('body').text();
         var isValid = txt.length > 0 && txt.length <= Editor1CountLimit;
         args.IsValid = isValid;
     }

</script> 


      <asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div>

            <div id="Info">Info</div>

  <%--  <cc1:Editor ID="Editor1" runat="server" />--%>
    <cc1:Editor ID="Editor1" runat="server" />
    <asp:CustomValidator ID="CustomValidator1" runat="server" ControlToValidate="Editor1" ClientValidationFunction="ValidateEditor1Length" ErrorMessage="Exceeded Character Limit"></asp:CustomValidator>


   <div id="Info1">Info</div>
   <%-- <cc1:Editor ID="Editor2" runat="server" />--%>
    <cc1:Editor ID="Editor2" runat="server" />
    <asp:CustomValidator ID="CustomValidator2" runat="server" ControlToValidate="Editor2" ClientValidationFunction="ValidateEditor1Length1" ErrorMessage="Exceeded Character Limit"></asp:CustomValidator>

</div>
<asp:Button ID="Button1" runat="server" Text="Button" />

Thank you.

Upvotes: 0

Views: 906

Answers (1)

Marco
Marco

Reputation: 23927

There should be a file called jquery-1.3.2.js and/or jquery-1.3.2.min.js. You need to reference one of those two. The VSdoc file you are using is just for intellisense purposes in older versions of Visual Studio.

Your Script tag should look like this:

<script type="text/javascript" src="scripts/jquery-1.3.2.js"></script>

In addition you might want to update to a newer verison of JQuery. According to Jquery.com/download, the uptodate-versions are 1.11.3 and 2.1.4.

Inside visual Studio you can also use the package manager console to install a new version of Jquery using the following command(s):

Install-Package jQuery
Update-Package jQuery

Upvotes: 1

Related Questions