CODEWITHSUNDEEP
javascriptjquerycheckboxsyntax-error
codingyo
codingyo

Reputation: 329

Uncaught ReferenceError: lookup is not defined at HTMLButtonElement.onclick

I keep getting this syntax error on the browser. I am not sure what am I missing here.

Basically I am trying to make a request to an external web api which takes an array of checked check box values as parameters passed in query parameter.

Here is my javascript.

 function lookup() {
        var query = document.getElementById("sform").value;
        //   var res = PageMethods.lookupfromjs_Click(query, onSuccess, onError);
        var dttypeList;
        $('#Button1').click(function() {
            $('input[type=\"checkbox\"]').each(function(){
                dttypeList.push(this.name);
                alert( $.toJSON(dttypeList));
            });
        });​
    }

Here is the html

<!DOCTYPE html>

<head runat="server">
    <title></title>
    <link href="style.css" rel="stylesheet" type="text/css" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"  type="text/javascript"></script>
        <script src="Scripts/lookup.js" type="text/javascript"></script>
    <script src="Scripts/getdatatype.js" type="text/javascript"></script>
</head>
<body>
    <section class="webdesigntuts-workshop">
    <form id="form1" runat="server">
         <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true" >

         </asp:ScriptManager>    
    <div>

        <asp:TextBox type="search" name="search" id="sform" placeholder="What are you looking for?" runat="server" />       
         <asp:TextBox type="search" name="hdnText" id="hdnText" runat="server" />

      <button id="Button1" onclick="lookup()" type="button">Search</button>

    </div>
    <div>
        <p> </p>
    </div>

            <div>
                 <button id="Getdtbtn"  type="button" onclick="getDatatypes()">Get Datatypes</button>
            </div>
        </form>


        </section>
</body>
</html>

Upvotes: 3

Views: 1938

Answers (1)

Ryan Munger
Ryan Munger

Reputation: 148

Does the lookup function even need to be declared? With the limited HTML snippet you posted, I tried to cobble something closer together resembling what you may have been trying to achieve:

var query =  document.getElementById('sform').value;
var dtypeList = [];
$('#Button1').click(function() {
  $('input[type="\checkbox\"]').each(function() {
  dtypeList.push(this.name);
  alert(JSON.stringify(dtypeList));
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form id="sform">
  <label for="Hello">Hello</label>
  <input type="checkbox" name="Hello">
  <label for="World">World</label>
  <input type="checkbox" name="World">
  <button id="Button1" type="button">Search</button>
</form>

This still loops through all of the checkboxes and spits them out to an alert once you click the button.

Also, please refer to this post about $.toJSON(): https://stackoverflow.com/a/7759630/3611025

Upvotes: 2

Related Questions