hi
I am a newbie and I know this is probably a dumb question but please can someone show me how to update a datagrids data based on a selection from an selector/input field.
I pretty much need the Datagrid to update via ajax based on a change of value in a input field.
Thanks
Shaun

Hi Shaun,
First of all, no question is a dumb question :)
As you know the KoolGrid has attachData() function at client-side, you can send any data to server and retrieve it through $_POST. So logic is that when your user key data into input field and hit button. You will attach that data to grid then refresh the grid. The data will be sent to server, and there you will prepare your SELECT statement for grid to show the correct data. As a result, at client-side the grid will show the data based on what user input.
The closet example is this Master/Detail example . In this example, instead of letting user key in the customerNumber into input field, it let user to select it from first grid then the result of customer order will be shown at second grid. The logic is the same. Here come the magic code:

    <script type="text/javascript">
        function Handle_OnRowSelect(sender,args)
        {
        //Prepare to refresh the grid_order.
        var _row = args["Row"];
        grid_order.attachData("customer_selected",1);
        grid_order.attachData("customerNumber",_row.getDataItem()["customerNumber"]);
        grid_order.refresh();
        grid_order.commit();
        }
    </script>

Let me know if you need further assistance.

Hi Pete
thanks :)
I've spent quite a lot of time to get my head around this but I have not got it right
The Maser/detail example doesn't 'really help me as I'm not posting from one grid to another but now that I think of it would I still need to pass through the date variables from the input fields via grid.attachData ?
I basically have 2 date input fields (start and end) and a grid which displays data between 2 dates which datasource is from an array. I update the datasource via a function which returns the array.

Hi Pete :
I've made great progress. Just have 1 issue to resolve. Basically I can now populate the grids datasource by selecting a value in the date input field.
The issue is now I cant scroll, sort etc. as the data disappears, but only if I use the date input field. If I use a querystring it works.. Here is what I did after using your advice earlier. I'll pull the relevant code snippets.

if (isset($_GET["startdate"]))
{
    $cdrs = fetchcdr($_GET['startdate'],$_GET['enddate']);
} 
else
{
    if (!$koolajax->isCallback)
    {
        
        $cdrs = fetchcdr($_POST['startdate'],$_POST['enddate']);
    } 
    else
    {
        $cdrs = fetchcdr($_POST['startdate'],$_POST['enddate']);
    }
}

      $('input[id=daterange]').on('apply.daterangepicker', function (ev, picker) {
          grid.attachData("startdate", picker.startDate.format('YYYY-MM-DD'));
          grid.attachData("enddate", picker.endDate.format('YYYY-MM-DD'));
          grid.refresh();
          grid.commit();
      });

After receiving the startdate and enddate from client, you need to save them to $_SESSION. So for any other cases, you need to get the startdate and enddate from $_SESSION to build the query for grid.

Working ;) Thanks for your help.

if (isset($_POST["startdate"]))
{
    $cdrs = fetchcdr($_POST["startdate"],$_POST["enddate"]);
    $_SESSION["startdate"] = $_POST['startdate'];
    $_SESSION["enddate"] = $_POST['enddate'];
} 
else
{
    if (!$koolajax->isCallback)
    {
        
        $cdrs = fetchcdr($_POST['startdate'],$_POST['enddate']);
    } 
    else
    {
        $cdrs = fetchcdr($_SESSION["startdate"],$_SESSION["enddate"]);
    }
}

Awesome!