jQuery UI Widgets Forums Grid Edit and Save To Database

This topic contains 7 replies, has 3 voices, and was last updated by  FrankRNY 9 years, 6 months ago.

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
  • Edit and Save To Database #58349

    lineker
    Participant

    Hi,

    I have a grid of which code is listed below.
    I am editing a cell but how I will redirect to my script to save to database?
    And also, I need CarID even if I change Country, how can I get it?

    var source =
    		{
    			datatype: "json",
    			datafields: [
    				{ name: 'CarID'},
    				{ name: 'Country'},
    				{ name: 'Car'},
    				{ name: 'MaxSpeed'},
    				{ name: 'Duration100'}
    			],
    			url: '../data/car.php',
    			cache: false,
    			processdata: function (data) {
    				data.cmd = 'json_city_list';
    			}
    		};
    		var dataAdapter = new $.jqx.dataAdapter(source);
    			
    		$("#jqxgrid").jqxGrid(
    		{
    		source: source,
    		autoheight: true,
            editable: true,
            selectionmode: 'singlecell',
            editmode: 'dblclick',
    		columns: [
    			{ text: 'CarID', datafield: 'CarID' },
    			{ text: 'Country', datafield: 'Country' },
    			{ text: 'Car', datafield: 'Car' },
    			{ text: 'MaxSpeed', datafield: 'MaxSpeed', cellsalign: 'right' },
    			{ text: 'Duration100', datafield: 'Duration100',  cellsalign: 'right' }
    		]
    		}); 
    		
    		$("#jqxgrid").on('cellbeginedit', function (event) {
                    var args = event.args;
                    alert(args.datafield);
    		alert(args.rowindex);
    		alert(args.value);
                });
                $("#jqxgrid").on('cellendedit', function (event) {
                    var args = event.args;
                      alert(args.datafield);
    	          alert(args.rowindex);
    		  alert(args.value);
    			});
    		$('#jqxgrid').jqxGrid('autoresizecolumns'); 
    Edit and Save To Database #58352

    Dimitar
    Participant

    Hello lineker,

    To synchronise with the database, use the source updaterow callback function (you can read more about it in the API Documentation, under source).

    As for getting other fields, you can achieve it in the cellendedit event:

    $("#jqxGrid").on('cellendedit', function (event) 
    {
        var row = args.rowindex;
        var data = $('#jqxGrid').jqxGrid('getrowdata', row);
        var CarID = data.CarID;
    });

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

    Edit and Save To Database #58364

    lineker
    Participant

    Hi Dmitar,

    Thank you very much for help.
    Now I can get other fields with your method:

    As for getting other fields, you can achieve it in the cellendedit event:
    
    $("#jqxGrid").on('cellendedit', function (event) 
    {
        var row = args.rowindex;
        var data = $('#jqxGrid').jqxGrid('getrowdata', row);
        var CarID = data.CarID;
    });

    But I could not use updaterow. I added it to my code but API does not explain how to synchtonise with database. It only writes follwing info:
    There are commented areas

    updaterow: function (rowid, rowdata, commit) {
    // synchronize with the server – send update command
    // call commit with parameter true if the synchronization with the server was successful
    // and with parameter false if the synchronization has failed.
    commit(true);
    }

    Edit and Save To Database #58365

    Dimitar
    Participant

    Hi lineker,

    There are CRUD examples, featuring updaterow, in the Documentation, using PHP and ASP.NET MVC 3, you can check out.

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

    Edit and Save To Database #58366

    lineker
    Participant

    Dear Dimitar,

    I of course know sql commands for CRUD. But I can not write CRUD operations to commeted area because it is javascript

    updaterow: function (rowid, rowdata, commit) {
    // synchronize with the server – send update command
    // call commit with parameter true if the synchronization with the server was successful
    // and with parameter false if the synchronization has failed.
    commit(true);
    }

    I want CRUD operations at a php file, for example crud.php, then how will I redirect to this file?

    Edit and Save To Database #58381

    Dimitar
    Participant

    Hello lineker,

    Both examples have updaterow implemented, too. Here is the callback from the PHP tutorial:

    updaterow: function (rowid, rowdata, commit) {
    	// synchronize with the server - send update command
            var data = "update=true&" + $.param(rowdata);
    			$.ajax({
                dataType: 'json',
                url: 'data.php',
    			cache: false,
                data: data,
                success: function (data, status, xhr) {
    				// update command is executed.
    				commit(true);
    			},
    			error: function(jqXHR, textStatus, errorThrown)
    			{
    				commit(false);
    			}							
    		});		
    }

    Please take a look at the CRUD guide again.

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

    Edit and Save To Database #58396

    lineker
    Participant

    Hi Dimitar,

    This is exactly what I searched. Thank you very much

    Edit and Save To Database #58408

    FrankRNY
    Participant

    I wish there were ASP.NET / Sql Server CRUD examples that weren’t MVC – just some basic ADO.

    Anyone out there have any to share?

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.