Question

Javascript newbie question
I’m fetching user input from text and use that value to send to the controller for further process. On page init everything is fine, now I want to bind OK button to send users value to my page init script (I’m trying to avoid copying script). Here’s the code

@Html.ActionLink("OK", "Ajax", null, new { @class = "button", @id ="myDate" }) 

on page init

$(document).ready(function dataTable() {
  $('#dataTable').dataTable({
            "bServerSide": true,
             "fnServerParams": function (aoData) {
                var date = $('input[name="myDate"]').val();
                aoData.push({ "name": "Date", "value": date });
   });
});

on user input and clicking the button I should take that input and sent to the above script to process

 $('#myDate').click(function () { 
     var date = $('input[name="myDate"]').val();
     // ????
     // Should I change first function to receive parameter as argument 

});

Answer 1

One way is to factor out the code to get the date outside the datatable init

function getDate(){
    var date = $('input[name="myDate"]').val();
    return date;
}

Then in your datatable init

 var date = getDate();

and the same in your click event

 $('#myDate').click(function () { 
     var date = getDate();
  });

You should end up with this

    $(document).ready(function dataTable() {
        function getDate(){
        var date = $('input[name="myDate"]').val();
       return date;
      }

     $('#dataTable').dataTable({
        "bServerSide": true,
         "fnServerParams": function (aoData) {
            var date = getDate();
            aoData.push({ "name": "Date", "value": date });
               });
           });


              $('#myDate').click(function () { 
                 var date = getDate();
              });
        });