Jquery Code Snippet

Use Of :not(), :not, :nth-child()
Note that since JavaScript arrays use 0-based indexing, these selectors reflect that fact. This is why $( ".myclass:eq(1)" ) selects the second element in the document with the class myclass, rather than the first. In contrast, :nth-child(n)uses 1-based indexing to conform to the CSS specification.
ecause jQuery's implementation of :nth- selectors is strictly derived from the CSS specification, the value of n is "1-indexed", meaning that the counting starts at 1. For other selector expressions such as :eq() or :even jQuery follows JavaScript's "0-indexed" counting. Given a single <ul> containing two <li>s, $( "li:nth-child(1)" ) selects the first <li> while $( "li:eq(1)" ) selects the second.
https://api.jquery.com/nth-child-selector/ 
https://api.jquery.com/eq-selector/ 
$("#table4 tr:not(:last,:first,#table4-first-tr, :nth-child(2) )").remove(); 

Check If A Checkbox Is Checked With jQuery 

// Trigger checkbox click on it's parent click

1. $("body").on("click", ".checkbox-td", function (event) {
2.             debugger;
3.             $(':checkbox', this).trigger('click');
4.             event.stopPropagation(); 
5.         }); 

If checkbox is checked or not

1. if (jQuery(this).is(':checked')) { }
2. else if (jQuery(this).is(':not(:checked)')) { }

When testing local server ajax was working fine. But when put in http://192.168.153.253/ERP/ ajax wasn't working.
get that ERP was added and for the shake a base url is needed.

1. <script type="text/javascript"> 
2.         var base = '@Url.Content("~/")';
3. </script>

jQuery track when #Mymodal is colosed

1. $('#myModal').on('hidden.bs.modal', function (e) {})
2. jQuery Delaying While Removing/Adding CSS
3. setTimeout(function () {
4. ClickedTd.css("border", "0px solid green");
5. }, 2000);

#Remove checkbox with delay one by one:  First one work. If I put  check box in setTimeout then it will refer  $(this) = wind function and checkbox aren't removed

1.                var i = 0;
2.                 $(".checkbox-td .ckbox:checkbox:not(:disabled)").each(function () {
3.                     i++;
4.                     var chkbox = $(this);
5.                     setTimeout(function () {
6.                         chkbox.remove();
7.                     }, 1000 - 100 * i);
8.                 });
9.                 i = 0;
10.                 $(".checkbox-td .ckbox:checkbox:not(:disabled)").each(function () {
11.                     i++;
12.                     setTimeout(function () {
13.                         $(this).remove();
14.                     }, 1000 - 100 * i);
15.            });

# Juquery $.Ajax  Jquery Ajax Method  with object variable as data

1.  //dyes_forecasting.ForecastingHead = dyes_forecasting_head_list;
2. //dyes_forecasting.DyesRecipe = dyes_recipe_list;
3. //var data = "{'model':" + JSON.stringify(dyes_forecasting) + "}";
4. function LoadList() {
5.     var jdata = PrepearJasonData('filter-item');
6.     //alert(JSON.stringify(jdata));
7.     WaitMeStart();
8.     $.ajax({
9.         type: 'POST',
10.         url: '/tablessetup/List',
11.         contentType: "application/json; charset=utf-8",
12.          data: JSON.stringify(jdata),
13.        // data: JSON.stringify({ "Ldno": Ldno }),
14.         success: function (data) {
15.             $('#content-box').html(data);
16.             InitForm();
17.             InitSortingHeader("content-box");
18.         },
19.         error: function (e) {
20.             //alert(e.responseText);
21.             WaitMeStop();
22.            // l.stop();
23.             alertify.error("Something technical error occurred");
24.         }
25.     }).done(function () {
26.         WaitMeStop();
27.        // l.stop();
28.     });
29.  }
30.   

 Ajax Call To Load Search Data From Server And Get Title Error 

1.                 $.ajax({
2.                     type: 'POST',
3.                     url: base + "Chemical/SearchOrderDetails",
4.                     contentType: "application/json; charset=utf-8",
5.                     //data: JSON.stringify(jdata),
6.                    //data: JSON.stringify({ "Ldno": Ldno }),
7.                     success: function (data) {
8.                         if (data.indexOf("No record was found") >= 0) {
9. 
   
10.                             IaoCustomizedMessage(data.toString(), "warning", "dark", true, 2500);
11.                             $("#grid").append("<tr><td colspan='12'>" + data + "</tr></td>");
12.                         }
13.                         else {
14. 
    
15.                             $("#grid").append(data);
16.                             ProcesDyesRecipePercantageTableDivVisibility("show");
17.                         }
18. 
    
19.                     },
20.                     error: function (error) {
21. 
    
22.                         if (typeof error.message == "undefined") {
23.                             var element = $(error.responseText);
24.                             var message = element.get(1).innerText;
25.                             IaoCustomizedMessage(message, "error", "dark", true, 8000);
26.                         }
27.                         else IaoCustomizedMessage(e.message, "error", "dark", true, 5500);
28. 
    
29.                     }
30.                 }).done(function () {
31.                 IaoCustomizedMessage("Successfully retrieve data from server", "success", true, 1500);
32. });

Juquery $.Ajax  Jquery Ajax Method with variable as data For Php Page

1.     $("body").on("change", "#buyer", function() {
2.     console.log("Allahu Akbor");
3.     var buyer = $("#buyer").val().trim();
4.     var order = $("#order").val().trim();
5.     $.ajax({
6.         type: 'GET',
7.         url: 'GetOrderList.php',
8.         contentType: "application/json; charset=utf-8",
9.         data:   { buyer : buyer, order : order   } ,
10.         success: function (data) {
11.             $('#message').html(data);
12.              
13.         },
14.         error: function (e) { 
15.         }
16.     }).done(function () {
17.      console.log("Alhamdulilla"); 
18.     });
19.    });

       Iao Customized Message

1. IaoCustomizedMessage(data.toString(), "warning", "dark", true, 2500);
2.     <link href="@Url.Content("~/Bootstrap/iao-alert.css?_" + DateTime.Now.Ticks)" rel="Stylesheet" /> 
3.    <script src="@Url.Content("~/Bootstrap/iao-alert.jquery.js?v=" + 1.1)"></script>
4.  function IaoCustomizedMessage(msg, type, mode, autoHide, alertTime) { // By Muhammad Ashikuzzaman in 2018.10.06
5.             if (typeof type == "undefined" || type === "") {
6.                 type = "notification";
7.             } if (typeof autoHide == "undefined" || autoHide === "") {
8.                 autoHide = true;
9.             }
10.             if (typeof alertTime == "undefined" || alertTime === "") {
11.                 // alertTime = 3000;
12.             }
13.             if (typeof mode == "undefined" || mode === "") {
14.                 mode = "dark";
15.             }
16.             $.iaoAlert({ 
17.                 // default message
18.                 msg: msg, 
19.                 // or 'success', 'error', 'warning'
20.                 type: type, //"notification", 
21.                 // or light dark
22.                 mode: mode, 
23.                 // auto hide true, false
24.                 ////  autoHide: true,
25.                 autoHide: autoHide, 
26.                 // fade animation speed
27.                 fadeTime: "2800",
28.                 // timeout in milliseconds
29.                 alertTime: alertTime, 
30.                 // shows close button
31.                 closeButton: true, 
32.                 // close on click
33.                 closeOnClick: true, 
34.                 // custom position
35.                 position: 'bottom-right', 
36.                 // fade on hover
37.                 fadeOnHover: true, 
38.                 // z-index
39.                 zIndex: '999', 
40.                 // additional CSS class(es)
41.                 alertClass: '' 
42.             });
43.         } 

   Data Table Related Code Snippet :

  Reload Datatable after ajax success

1.   $('body #quality_control_table').dataTable().fnDestroy();

Detect Shift + Enter key Press or Ctrl + Enter Key Press Or Any key Press

1.   $(document).keydown(function (e) {
2.             if (e.keyCode == 13 && !e.shiftKey) { // If shiftKey + ENter is hit
3.                 debugger;
4.                 console.log("Only Enter Press");
5.                 e.preventDefault();
6.             }
7.             else if (e.keyCode == 13 && e.shiftKey) { // If shiftKey + ENter is hit
8.                 debugger;
9.                 console.log("Shift Entered Pressed");
10.             }
11. 
    
12.         });
13.         $("body").on("keydown", ".AfterHeatSetInfo", function (e) {
14.             if (e.keyCode == 13 && !e.shiftKey) { // If shiftKey + ENter is hit
15.                 debugger;
16.                 console.log("Only Enter Press");
17.                 e.preventDefault();
18.             }
19.             else if (e.keyCode == 13 && e.shiftKey) { // If shiftKey + ENter is hit
20.                 debugger;
21.                 console.log("Shift Entered Pressed");
22.             }
23. 
    
24.         });