CODEWITHSUNDEEP
javascriptc#jqueryhtmlasp.net
MaxW
MaxW

Reputation: 421

I can´t get Javascript code runs

Edit the problem is on the bottom!!

I want to get my autocomplete function to work and always I get this :

The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>). Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.

My script and the html code:

<head runat="server">
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title><%--<%= Page.Title %> --%>- Ticketsystem</title>
  <link href="~/Content/master.css" rel="stylesheet" type="text/css" />
  <asp:PlaceHolder runat="server">
    <%: Scripts.Render( "~/bundles/modernizr") %>
  </asp:PlaceHolder>

  <webopt:bundlereference runat="server" path="~/Content/css" />
  <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />



   <script type="text/javascript" src="http://code.jquery.com/jquery-2.1.4.js"></script>



<script type="text/javascript" lang="ja">
    $(function ()
    {
       $('#tbCompany').autocomplete(
           {
               source: function (request, response)
               {
               $.ajax({
                   url: "Autocomlete.asmx/GetCompanyNames",
                   data: "{ 'searchTerm': '" + request.term + "' }",
                   type: "POST",
                   dataType: "json",
                   contentType: "application/json;charset=utf-8",
                   success: function (result) {
                       response(result.d);
                   },
                   error: function (result) {
                       alert('There is a problem processing your request');
                   }
               });
           },
           minLength: 0
       });
   });
</script>
</asp:PlaceHolder>

  
</head>

<body>
  <form runat="server">
<asp:TextBox ID="tbCompany" runat="server" Style="margin-top:10px" ClientIDMode="static"></asp:TextBox>

I don´t know if my script is wrong or somthing is missing. I tried to put it on the end of my page, in a div or placeholder like suggested from other questions.

edit: Now i did nearly everything what you suggested and now it looks like above and the error below.

error:

Uncaught TypeError: $(...).autocomplete is not a function

Upvotes: 0

Views: 172

Answers (7)

AshishJindal
AshishJindal

Reputation: 176

You need to place your script inside placeholder tag.

 <asp:PlaceHolder runat="server">
<script type="text/javascript" lang="ja">
    $(function() {
      $("#<%=tbCompany.ClientID%>").autocomplete({
        source: function(request, response) {
          $.ajax({
            url: "Autocomlete.asmx/GetCompanyNames",
            data: "{ 'searchTerm': '" + request.term + "' }",
            type: "POST",
            dataType: "json",
            contentType: "application/json;charset=utf-8",
            success: function(result) {
              response(result.d);
            },
            error: function(result) {
              alert('There is a problem processing your request');
            }
          });
        },
        minLength: 0
      });
    });
  </script>
</asp:PlaceHolder>

EDIT: It seems that latest error is because of missing jQuery UI js or incorrect sequence. Can you remove all the jQuery related js files and add the latest version of jQuery afterthat jQuery UI in your code ?

Upvotes: 1

Darren Wainwright
Darren Wainwright

Reputation: 30727

As in the comments, you're using .net 4.5.

.net 4 bought with it some changes to the asp.net controls. Especially one attribute called ClientIDMode

This allows you to control how ASP.Net renders and renames the ID of controls. You can now tell .net to leave them alone..

You can change this:

$('#<%=tbCompany.ClientID%>').autocomplete({...

To this:

$('#tbCompany').autocomplete({...

And on the element with the ID of tbCompany add the attribute ClientIDMode="static" - this will tell .net to leave the ID alone and use whatever you have set.

See more about ClientIDMode here

Upvotes: 0

Lucas Souza
Lucas Souza

Reputation: 371

As you can see here: https://support.microsoft.com/en-us/kb/976112 the inline expression <%: doesn't exist.

Try to change <%: ... %> to <%= ... %>.

Your also loading jquery twice. Your jquery UI version is 1.10.3 but you're loading version jquery-1.9.1.js.

Try to load these versions:

<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.4.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.11.4/themes/ui-lightness/jquery-ui.css">

Upvotes: 1

Lumi.seven
Lumi.seven

Reputation: 13

Did you mind try separated the "#<%=tbCompany.ClientID%>" use variable? As: <%= String value = tbCompany.ClientID%> And :$("#value").... May the "autocomplete" is not the point.

Upvotes: 0

salc2
salc2

Reputation: 577

Try <%# tbCompany.ClientID %> instead <%=tbCompany.ClientID%> 

<script type="text/javascript" lang="ja">
    $(function() {
      $("#<%# tbCompany.ClientID %>").autocomplete({
        source: function(request, response) {
          $.ajax({
            url: "Autocomlete.asmx/GetCompanyNames",
            data: "{ 'searchTerm': '" + request.term + "' }",
            type: "POST",
            dataType: "json",
            contentType: "application/json;charset=utf-8",
            success: function(result) {
              response(result.d);
            },
            error: function(result) {
              alert('There is a problem processing your request');
            }
          });
        },
        minLength: 0
      });
    });
  </script>

Upvotes: 0

Sundar Singh
Sundar Singh

Reputation: 686

Are you loading Jquery-ui.{version}.js as i can't see it in your code that is for autocomplete error.

If you are writing code in seprate js file then <% %> will not work , In Place of that you can use ClientIDMode as static and in place aspx syntax you can use 

$("#tbCompany")

Hope it will work.

Upvotes: 0

Vigikaran
Vigikaran

Reputation: 725

it seems too many jQuery files added in the head, try to use only one jquery and it may resolve this issue

you can just use only the latest version minified file.

Upvotes: 0

Related Questions