jQuery

17K

Solutions

5K

Contributors

jQuery (Core) is a cross-browser JavaScript library that provides abstractions for common client-side tasks such as Document Object Model (DOM) traversal, DOM manipulation, event handling, animation and Ajax. jQuery also provides a platform to create plugins that extend jQuery's capabilities beyond those already provided by the library.

Share tech news, updates, or what's on your mind.

Sign up to Post

Hi

I've got this code to work with and I need to make it jquery enabled tabs

I cannot amend this code as it comes from a 3rd party web service so im hoping one of you guru's can make it tabbable, my attempts fail miserable and it all shows, then all disappears each time :(

Tab names and tab content will obviously change but the other naming conventions will always be the same

Thanks
Neil


<div id="content">

  <ul class="nav nav-tabs" id="details_tabs" data-tabs="details_tabs">
    <li class="active"><a href="#details_tab_1" data-toggle="tab">My details</a></li>
    <li><a href="#details_tab_2" data-toggle="tab">Availability</a></li>
    <li><a href="#details_tab_3" data-toggle="tab">Likes</a></li>
  </ul>
  
  <div class="tab-content" id="details_tabs_content">  
    <div class="tab-pane active" id="details_tab_1"> content for tab 1</div>
    <div class="tab-pane" id="details_tab_2"> content for tab 2</div>
    <div class="tab-pane" id="details_tab_3">content for tab 3</div>
  </div>
  
</div>

Open in new window

1
Announcing the Winners!
LVL 13
Announcing the Winners!

The results are in for the 15th Annual Expert Awards! Congratulations to the winners, and thank you to everyone who participated in the nominations. We are so grateful for the valuable contributions experts make on a daily basis. Click to read more about this year’s recipients!

After attempting to edit a mysql record in node.js, I am receiving null results when I review the mysql query report and the affected rows are returning zero.  There is no change to the record. However, the backend says that the results are not null, the sql query is not null and that the req.body for all the values are not null.

Here is the mysql general query log:

190717 16:42:40	    3 Query	SELECT * FROM stores
		    3 Query	SELECT * FROM stores
		    3 Query	SELECT * FROM stores
190717 16:42:42	    3 Query	SELECT * FROM stores
190717 16:43:13	    3 Query	UPDATE stores SET `station` = NULL, `address` = NULL, `monthly c-store sales` = NULL,`operator` = NULL, `top sku` = NULL WHERE `id` = NULL

Open in new window


These are the results returned on the frontend:

affectedRows: 0
changedRows: 0
fieldCount: 0
insertId: 0
message: ""
protocol41: true
serverStatus: 2
warningCount: 0

Open in new window


However, the backend says that the values are not null after putting in the following code:

if (results !== null) {
        console.log('results is not null');
        }else{
        console.log('results is null');
        };


      if (sql !== null) {
      console.log('sql is not null');
      }else{
      console.log('sql is null');
      };

      if (req.body.Station !== null) {
        console.log('req.body is not null');
        }else{
        console.log('req.body is null');
        };

Open in new window


Here are the results.....
{ station: 'Hopefully',
  address: 'this',
  monthlycstoresales: '200',
  operator: 'will',
  topsku: 'work',
  id: '7' }

results is not null

sql is not null

req.body is not null

Open in new window



Here is the backend code:

Open in new window

0
What is the correct jQuery usage ( document ).ready... or ('document').ready...?  I've always used ( document ).ready, but I'm working with a developer module that uses ('document').ready; and it seems to work. Are the forms interchangeable?
0
I have a link that i first need to check the user has delete permission then do a confirm on the delete link before submitting, everything works except the cancel, this continues the delete action

function validate2() {
document.getElementById('DeleteLink').addEventListener("click", function(e) {
        e.preventDefault();
        });

   if (1 == 1) // this will be a dynamic value when working
   {

    var delyes = confirm('Are you sure you want to delete this work order\nClick ok to Delete or Cancel to return to the page\nTHIS CAN NOT BE REVERSED'); // prompt user
       if (delyes == true)
        {
          return true;
    } else {

             return false;
       }
   } else {
   alert('no chance')
       return false;
   }
}

Open in new window

i am calling like this

<a onclick="retrun validate2();" id="DeleteLink"class="tab1" href="

Open in new window

only thing not working is the cancel button on confirm box
1
I am struggling to store a JSON result from SPServices to use later if a cell in my table ishovered over.

SPServices perfectly creates the intended JSON format.

JSON result from SPServices call - formatting lost when I add one of the object results to a div
I then use JSON.parse and am able to extract a matching result that is formatted correctly when I view it in the console log. Including the "new line" references.

However, when I use the $('#hoverpopup').html(resultdata); to put the results into a DIV the formatting gets completely wiped out and everything is jumbled together.  This is on line 83 in the code.

This is the full code. The data in the JSON does include a \n reference so not sure if that is the problem. if the console result looks good I am guessing it is how I am appending the data to the div that is causing the problem?

//hide the DIV for hover results 
$('#wrapper').hide();

function getmappingtabledata() {
    $("#jsoninfo").val = '';
    var jsondata;


    // Download SP List data for lookup  
    $().SPServices({
        operation: "GetListItems",
        async: false,
        webURL: "https://jnj.sharepoint.com/teams/LMS_Automation/dashboard/",
        listName: 'Mapping_Def_PROD',
        CAMLQuery: '',
        completefunc: function(xData, Status) {
            jsondata = $(xData.responseXML).SPFilterNode("z:row").SPXmlToJson({
                mapping: {
                    ows_Title: {
                        mappedName: "ruleid",
                        objectType: "Text"
                    },

Open in new window

0
I want to post my form data from my web site to another domain but I want to show the other domain's web site on my page as an iframe.
Is it possible? if it is, how can I do that? Could you possibly show me the an example? Thank you in advance.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
</head>

<body>

<form target="myiframe" method="post">

ref no:
<input type="text" name="clientRefCode" value="123456"/><br/>
productId:
<input type="text" name="productId" value="1"/><br/>

<hr>
<input type="submit" value="Send" />
</form>


<iframe name="myiframe" src="https://www.w3schools.com" sandbox="allow-forms" width="100%"></iframe>

</body>
</html>

Open in new window

0
I have a table that has 7 columns and 3 rows. In some of the cells I have anchors. I would like to make the anchors dragable so I can move them to other cells in the table.  The anchors all have the class: isSortable.

I have tried adding the following:
$('a.isSortable').sortable();

Open in new window


but that doesn't seem to work. What do I use to make the anchors dragable to other cells?
0
I would like to parse a JSON file that is stored in the same place as my webpage and create an HTML table dynamically using some type of jquery,

I have not been able to get this to work successfully.

This is what the JSON data looks like:

[{"WWID":"1000000290","FULL_NAME":"JAIPRAKASH GABA","Rule Type":null,"Learner Region":null,"MappingIDs":null,"HCCO Name":"zz-Not Mapped","HCCO WWID":null,"WORK_REGION":"NORTH AMERICA","MRC_CODE":"001270","LEGAL_ENTITY_CODE":"006084","Leader WWID":null,"Leader Name":null,"Audience":null}
,{"WWID":"1000000354","FULL_NAME":"MARK KOMEN","Rule Type":null,"Learner Region":null,"MappingIDs":null,"HCCO Name":"zz-Not Mapped","HCCO WWID":null,"WORK_REGION":"NORTH AMERICA","MRC_CODE":"001410","LEGAL_ENTITY_CODE":"006090","Leader WWID":null,"Leader Name":null,"Audience":null}
,{"WWID":"1000000419","FULL_NAME":"ALEXIS BAKER","Rule Type":null,"Learner Region":null,"MappingIDs":null,"HCCO Name":"zz-Not Mapped","HCCO WWID":null,"WORK_REGION":null,"MRC_CODE":null,"LEGAL_ENTITY_CODE":null,"Leader WWID":null,"Leader Name":null,"Audience":null}
,{"WWID":"1000000420","FULL_NAME":"MARGARIDA CALDEIRA","Rule Type":null,"Learner Region":null,"MappingIDs":null,"HCCO Name":"zz-Not Mapped","HCCO WWID":null,"WORK_REGION":null,"MRC_CODE":null,"LEGAL_ENTITY_CODE":null,"Leader WWID":null,"Leader Name":null,"Audience":null}

Open in new window


I would like to create a table that includes all of the filed names: WWID, FULL_NAME, etc and the values

Any help would be greatly appreciated.
0
I have a table that looks something like:
<tr class='istitle' data-id='title-1'><td>title test 1</td><tr>
<tr><td>row 1</td></tr>
<tr><td>row 2</td></tr>
<tr><td>row 3</td></tr>
<tr class='istitle' data-id='title-2'><td>title test 2</td><tr>
<tr><td>row4</td></tr>
<tr><td>row 5</td></tr>
<tr class='istitle data-id='title-3''><td>title test 3</td><tr>
<tr><td>row 6</td></tr>

Open in new window


and I have set the table to be sortable using jQuery. When a row is moved to a new location how do I get the previous row that has the class='istitle'?

For example, if I move row 5 to be before row 3 then I need to get the row with data-id='title-1'
0
Data Tables are not being displayed with data from the database.  I am receiving the following error:

jquery.dataTables.min.js:40 Uncaught TypeError: Cannot read property 'length' of undefined

Here is the code:

<!--Data Tables:css-->
  <link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
<!--Data Tables-->
    <script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>

$(document).ready(function () {
$('#datatable').DataTable({
"processing": true,
"serverSide": true,
"ajax": {
"url": "http://localhost:5000/alldata",
"type": "GET"
},
"columns": [
{ "data": "ID" },
{ "data": "Station" },
{ "data": "Address" },
{ "data": "C-Store Sales" },
{ "data": "Operator" },
{ "data": "Top SKU" }
]
});
});

Open in new window


<!---(2b)-->
    <h3>Data Table</h3>
    <form id="form1">
      <table class="table table-bordered table-striped" id="datatable">
        <thead>
          <tr>
            <th>ID</th>
            <th>Station</th>
            <th>Address</th>
            <th>C-Store Sales</th>
            <th>Operator</th>
            <th>Top SKU</th>
          </tr>
        </thead>
      </table>
    </form>

    <hr>

    <br />

Open in new window

0
Why Diversity in Tech Matters
LVL 13
Why Diversity in Tech Matters

Kesha Williams, certified professional and software developer, explores the imbalance of diversity in the world of technology -- especially when it comes to hiring women. She showcases ways she's making a difference through the Colors of STEM program.

Hi:

I notice that this javascript within the PHP script naturally appears in Page Source in firefox (and I assume in all browsers).

    <script language="javascript" type="text/javascript"></script>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

    <!--[if lt IE 9]>
        <script src="/dir1/js/html5shiv.js"></script>
        <script src="/dir1/js/respond.min.js"></script>
    <![endif]-->

    <script>
    function myGenFunction()
    {
        setTimeout(function(){window.location = "https://www.example.com/dir1/index.php"},30000);
	/* 30 sec timeout */
    }
    </script>

Open in new window

Later ..

        <body onload="myGenFunction()">

Open in new window

Followed by PHP code.

I'm building security into my app as a high priority and wonder if the javascript above makes hacking easier?
If so, is there some way to minimize its hackability?

Cheers
1
Hi, I can not select the checkbox and send the value in an array.

            <td>
              <div class="custom-control custom-checkbox mb-3">
                <input class="custom-control-input" id="checked1[]" name="checked1[]" value="1" type="checkbox"
                <?php if(in_array("1",$campo_enfermedad1)) { ?> checked="checked" <?php } ?>>
                <label class="custom-control-label" for="checked1[]"></label>
              </div>
            </td>
            <td>
              <div class="custom-control custom-checkbox mb-3">
                <input class="custom-control-input" id="checked1[]" name="checked1[]" value="2" type="checkbox"
                <?php if(in_array("2",$campo_enfermedad1)) { ?> checked="checked" <?php } ?>>
                <label class="custom-control-label" for="checked1[]"></label>
              </div>
            </td>
            <td>
              <div class="custom-control custom-checkbox mb-3">
                <input class="custom-control-input" id="checked1[]" name="checked1[]" value="3" type="checkbox"
                <?php if(in_array("3",$campo_enfermedad1)) { ?> checked="checked" <?php } ?>>
                <label class="custom-control-label" for="checked1[]"></label>
              </div>
            </td>
            <td>
              <div class="custom-control custom-checkbox mb-3">
                <input class="custom-control-input" id="checked1[]" name="checked1[]" value="4" type="checkbox"
                

Open in new window

1
I'm going through a Node tutorial and I'm at the point where I'm working with "express-validator."

According to the docs, "express-validator" is "...a set of express.js middlewares that wraps validator.js validator and sanitizer functions."

Easy enough, but I want to better understand that definition and it's bugging me that I've never installed the "validator.js" library.

Here's what I understand:

Middleware acts as a bridge between two applications. In the context of Node, Express is middleware specifically in the way it intercepts and interacts with the request and the response objects that are coming from the DOM (feel free to stop me at any time if I'm not accurate).

A "wrapper," according to https://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_html_wrap_element, is something that's going to "wrap" around a div...

So, going back to the original definition, it looks as though Express-Validator is wrapping around the "validator.js" library and making it more intuitive to use.

But where does "validator.js" come from? I've never installed it, so how did that become use-able?

And then when I look at the example of the Jquery "wrap" method (https://www.w3schools.com/jquery/html_wrap.asp)...

How does express-validator "wrap" around validator.js?
0
I've got a form that will be uploading a zip file in addition to some other text data.

Before the form is submitted, I need to first ensure that the zip file that's getting ready to be posted doesn't have a name that's already in the database. So, as part of my validation, I'm posting the basename of the zip file to an api that returns a value that indicates whether or not it's a duplicate or not. Provided it's not a duplicate, my validation process then goes on to make sure that the other fields have been properly filled out.

Here's the snag...

I'm assuming that I need to structure this as a callback, but I don't know how. Here's my code:

<?php
session_start(); 
if (@$_SESSION['auth'] != "yes")                   
{
header("Location: default.php");
exit();
}

require_once('header.php');

?>

<style>

#picture_gallery {
	width:200px;
	height:200px;
	background-color:#ffffff;
	border:1px solid #ccc;
	border-radius:10pt;
	background-color:#ffffff;
	position:fixed;
	margin-left:400px;
	display:none;
	margin-top:100px;
	z-index:1000;
	}
	
	#picture_frame {
		height:25px; 
		background-color:#ccc; 
		border-top-left-radius:10pt; 
		border-top-right-radius:10pt; 
		width:100%; 	
	}
	
}

</style>
<div id="picture_gallery">
	<div id="picture_frame">
		<div style="float:right; margin-right:10px; padding-top:3px;"><a id="close" href="#" style="text-decoration:none;">&#8855;</a></div>
		<div id="gallery" style="width:100%; text-align:center; padding-top:30px;"></div>
	

Open in new window

1
I have sort of a related question here: https://www.experts-exchange.com/questions/29151129/use-an-oninput-event-to-change-states-of-button.html

Please go to: https://dev.magickitchen.com/menu/main_courses.html  and add something to the cart. If you need user/pw, please use mel/mel.

Then add a zip code and click on checkout. On the checkout page, you will see this:

company.JPG
What I would like to do is, if someone enters text into the field Company, I'd like the dropdown to automatically change from Residential to Commercial. Is that possible with jquery?
0
Please go to: https://dev.magickitchen.com/menu/main_courses.html  and add something to the cart. If you need user/pw, please use mel/mel

I would like to use an oninput event to make the calculate button go back and forth between hover state and non-hover state when text is entered into the zip code box.

So, enter a zip code, the button flashes back and forth between white and black.
white.JPG black.JPG
But need help with that. Thanks!
0
I am trying to delete and edit records in the mysql database on the frontend.  I have already tested it on the backend with postman and it works for the urls called but I am not certain how to do it on the frontend using an a href link on the station_data variable below.  I have a href on it which links to creating a new record and it works.  However, I would like to give the user the ability to have  each specific edited or deleted.  I have linked both to the id of the record but I don't know how to include it in the href link of the anchor tags.

Here are the URLs:
(1) localhost:5000/stationNames/number/:id    -    (Deleting info by id number)
(2) localhost:5000/edit/:id    -    (Updating/editing info by id number)

HTML
<!--Loading Stores Data on Click Button-->
    <h3>Store Data</h3>

    <!---(1)-->
    <h3>Data List</h3>
    <button type="button" id="allData">Load Stores Data</button>
    <br />
    <br />
    <div id="stores"></div>

Open in new window



$(document).ready(() => {
    //(1)
    $('#allData').click(() => {
      if ($('#stores').is(':empty')) {
        console.log('It is empty, data can load');
        $.ajax({
          //$.getJSON({
          url: 'http://localhost:5000/alldata',
          type: 'GET',
          datatype: 'json',
          success: (data) => {
            //console.log('You received some', data);
            //var test = JSON.stringify(data);
            //console.log(test);
            var station_data = '<a 

Open in new window

1
Normally Javascript is forgiving if you have special characters or spaces within the titles/keys of a database names.  You can simply remove the spaces between the words in the title, use all lower cases or use (`       `) when making queries, but I have found that there is no solution in JQuery for this mistake.  Is there a solution to this?

For example the headings below for (Monthly C-Store Sales) & (Top SKU) have spaces and/or special characters and because of this, all the values inserted are appearing as undefined or null........Is there a solution to this other than removing the spaces/characters from the database keys?
$.ajax({
        url: 'http://localhost:5000/station',
        type: 'POST',
        data: {
          Station: $('#store').val(),
          Address: $('#location').val(),
          Monthly C-store Sales: $('#sales').val(),
          Operator: $('#dealer').val(),
          Top SKU: $('#topitem').val()
        },
        success: (data) => {
          $('#statusF').html(data.message);

Open in new window

0
Hi All,

I'm trying to expand programmatically an accordion menu based on saved values in local-storage.
The problem is that it saves the values, i get back the values, but it's not expanding the active ones.
I use the following accordion library:
(function(jQuery){
     jQuery.fn.extend({  
         accordion: function() {       
            return this.each(function() {
            	
            	var $ul = $(this);
            	
				if($ul.data('accordiated'))
					return false;
													
				$.each($ul.find('ul, li>div'), function(){
					$(this).data('accordiated', true);
					$(this).hide();
				});
				
				$.each($ul.find('a'), function(){
					$(this).click(function(e){
						activate(this);
						return void(0);
					});
				});
				
				var active = (location.hash)?$(this).find('a[href=' + location.hash + ']')[0]:'';

				if(active){
					activate(active, 'toggle');
					$(active).parents().show();
				}
				
				function activate(el,effect){
					$(el).parent('li').toggleClass('active').siblings().removeClass('active').children('ul, div').slideUp('fast');
					$(el).siblings('ul, div')[(effect || 'slideToggle')]((!effect)?'fast':null);
				}
				
            });
        } 
    }); 
})(jQuery);

Open in new window


My HTML (i generate the menu from C#) + JS: Init that gets the menus/submenus that i clicked earlier (but not expanding them :o(   ):
<!--MENU-->
<div id="pageWrap" class="pageWrap">
	<div class="pageContent">
		<ul class="accordion">
			<div

Open in new window

1
Become a Certified Penetration Testing Engineer
LVL 13
Become a Certified Penetration Testing Engineer

This CPTE Certified Penetration Testing Engineer course covers everything you need to know about becoming a Certified Penetration Testing Engineer. Career Path: Professional roles include Ethical Hackers, Security Consultants, System Administrators, and Chief Security Officers.

I have a search field which provides data from a database for the user. It works well but the autocomplete coding doesn't.  The station names are suppose to automatically show. Please see the code below...

<h3>Search Box</h3>
    <label>Type Station Name</label>
    <input id = "stationBox" type="text">
    <ul id="autoList"></ul>
    <button id ="stationOne" >Submit</button>
    <div id="searchResult"></div>

Open in new window


//Inserting information in a search bar--
<script>
  $(document).ready(() => {
    $('#stationOne').click(() => {
      var requestUrl = 'stationNames/' + $('#stationBox').val();
      console.log('making ajax request to', requestUrl)
      $.ajax({
          url:requestUrl,
          type:'GET',
          datatype:'json',
          success: (data) => {
          console.log('You received some', data);
            
          var search_data = '';
            $.each(data, function (key, value) {
              //console.log(value.ID);
              search_data += '<li>ID: ' + value.ID + '</li>' +
                '<li>Station: ' + value.Station + '</li>' +
                '<li>Address: ' + value.Address + '</li>' +
                '<li>Sales: ' + value.Monthly_CStore_Sales + '</li>' +
                '<li>Operator: ' + value.Operator + '</li>' +
                '<li>Top SKU: ' + value.Top_SKU + '</li>' +
                '</<li>' + '<br/>';
            });

            $('#searchResult').html(search_data);
          }
      })
    });
  });
         

Open in new window

1
Using Jquery, I would like once the user selects a different item in the drop box list which was taken from a mysql database, that specific data to that field be displayed as formatted.

Currently, I am able to get the value of the item in the drop down box but I am unable to use it. I don't see many examples on the web which provides information regarding the use of the values.

<h3>Drop down Menu</h3>
    <select id="dmenu">
      <!--<option value = "" selected disabled>-- Choose Station --</option> -->
      <option selected="selected" id="opt">Choose your station</option> 
    </select>
    <div id="optionT"></div>
``````````````````````

  $(document).ready(() => {
    window.onload = ajaxCallback;
    function ajaxCallback(data) {
      var data;
      var myOptions;
      var output;
      $.ajax({
        url: 'http://localhost:5000/alldata',
        type: 'GET',
        datatype: 'json',
        success: (data) => {
          //$.each(data, function (index, value) {
                                   
          var output = [];

          $.each(data, function(key, value) {
          
            output.push('<option value="'+ key +'">'+ value.Station +'</option>');
          });
                       
          $('#dmenu').html(output.join(''));
        }
      })
     }
    });

       
         // (1) - alert( this.value ); produces the index position of station (e.g. 2, 3 etc)
         // (2) - alert($(this).find(":selected").value()); produces the 

Open in new window

1
I am using the jQuery date picker tool. When I select on an empty field I get a list of previously selected dates over top of the calendar. What do I need to do stop this from happening?

I have attached an image of what is happening.
Capture.PNG
0
Hello everyone ! I am trying to retrieve the country code when I use intlTelInput.
The mark and the number are well taken into account but the recovery of the callsign in Fr_Phone_1 gives me an error at the level of addEventListener.

$("#Fr_Telephone_1").intlTelInput({
initialCountry : "ci",
preferredCountries : ['ci','sn','tg','cd','fr'],

geoIpLookup	 : function(callback){
	$.get('https://ipinfo.io',function(){},"jsonp").always(function(resp){
		var countryCode=(resp && resp.country) ? resp.country : "";
		callback(countryCode);
	});
},
utilsScript : "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/15.1.0/js/utils.js"
});

var handleChange_1 = function() {
var text_1 = ($("#Fr_Telephone_1").isValidNumber()) ? $("#Fr_Telephone_1").getNumber() : "";
document.getElementById("Fr_Phone_1").value = text_1.replace('+','00');
};

document.querySelector("#Telephone_1").addEventListener('change', handleChange_1);
document.querySelector("#Telephone_1").addEventListener('keyup', handleChange_1);

Open in new window


I admit that I am a little lost and seek your help to correct this problem.
The values "_1" are administered at the first phone number, I can have as many "_2" ...

Thank you for your help
1
Hi everybody.
I'm still fighting with Javascript - I ususally do it :)
So, now I0m trying to recursively loop through an object to see if any property contains a string. I tried many pieces of code, but here I report two of them. Both give the same error:

snippet 1
                function iterate(obj, token) {
                    var cardsFound = [];
                    Object.keys(obj).forEach(function (key) {
                        if ($(obj[key]).toLocaleString().toLowerCase().indexOf(token.toLowerCase()) > -1) {
                            cardsFound.push(obj);
                        }
                        if (typeof obj[key] === 'object') {
                            iterate(obj[key]);
                        }
                    });
                    return cardsFound;
                }

Open in new window


Snippet 2
                function eachRecursive(obj, token) {
                    var cardsFound = [];
                    for (var k in obj) {
                        if (typeof obj[k] == "object" && obj[k] !== null) {
                            eachRecursive(obj[k]);
                        } else {
                            if (obj[k].toLocaleString().toLowerCase().indexOf(token.toLowerCase()) > -1) {
                                cardsFound.push(obj);
                            }
                        }
                    }
                    return cardsFound;
                }

Open in new window


The error is "TypeError: token is undefined" related to line 4 in the Snippet 1 and line 7 in the Snippet 2.

The calling handler event is as follows:
                $('#searchButton').on('click', function (e) {
                    e.preventDefault();
                    var sSearch = $('#searchbox').val();
                    alert(sSearch);
                    $('#card-wrapper').empty();
                    console.log(cards);
                    var foundCards = [];

                    foundCards = eachRecursive(cards, sSearch);

//                    foundCards = iterate(cards, sSearch);
                    console.log(foundCards);
                });

Open in new window


Any idea?
Thank you so much for any help.
0
Good Morning Dear Expert,

I'm actually using Cfswitch expression to play several module on the same page with a page's "refreshment" when i submit the form.. i would like to use Coldfusion and Ajax for a different experience.. Is it possible on a input or submit Click, to call an Ajax function on the same page and in this function, change the variable of the CFcase expression to play a different mudule ?

Any response will be helpful..
0

jQuery

17K

Solutions

5K

Contributors

jQuery (Core) is a cross-browser JavaScript library that provides abstractions for common client-side tasks such as Document Object Model (DOM) traversal, DOM manipulation, event handling, animation and Ajax. jQuery also provides a platform to create plugins that extend jQuery's capabilities beyond those already provided by the library.

Related Topics