[GowriParticipant]

Thanks Peter this works fine. Thanks a lot.

Regards,
Gowri.

[GowriParticipant]

Thanks Peter,

could you please share the link for cellClassName callback function and groupRender callback function. One more doubt is that possible to catch all the events in the grid like grouping, filtering, scrolling, etc…

Regards,
Gowri.

[GowriParticipant]

Hi Dimitar,

The sample you have given works great. But in my case I have a button in my row and I have to pass an ID (employee ID) when that button clicked.
Employee ID is present in my source. How can I pass Employee ID from source to cell Render function.

Regards,
Gowri.

[GowriParticipant]

Hi Dimitar,

The above sample works great. But in my case I have a button in my row and I have to pass an ID (employee ID) when that button clicked.
Employee ID is present in my source. How can I pass Employee ID from source to cell Render function.

Regards,
Gowri.

[GowriParticipant]

Peter,
It is not ASP.NET it is MVC 4 with HTML 5 application

Regards,
Gowri

[GowriParticipant]

peter,
Am I missing any references…?

 <script src="~/Scripts/jquery-1.10.2.min.js"></script>
        <script src="~/Scripts/knockout-2.2.1.js"></script>
        <script src="~/Scripts/knockout-mapping-2.0.0.js"></script>
        <link href="~/Content/Bootstrap/css/bootstrap-responsive.css" rel="stylesheet" />
        <link href="~/Content/Bootstrap/css/docs.css" rel="stylesheet" />
          <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>    
        <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>    
        <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script>    
        <script type="text/javascript" src="../../jqwidgets/jqxmenu.js"></script>    
        <script type="text/javascript" src="../../jqwidgets/jqxgrid.js"></script>    
        <script type="text/javascript" src="../../jqwidgets/jqxgrid.selection.js"></script>     
        <script type="text/javascript" src="../../jqwidgets/jqxgrid.columnsresize.js"></script>    
         <script type="text/javascript" src="../../jqwidgets/jqxdata.js"></script>     
        <script type="text/javascript" src="../../scripts/gettheme.js"></script>  

$(document).ready(function () {  
        var theme = getDemoTheme();
        var url = "Controller/Action";
        // prepare the data     
        var source = {
            datatype: "json",
            datafields: [{ name: 'Name', type: 'string' },
                         { name: 'Comments', type: 'string' },
                         { name: 'CreatedBy', type: 'int' },
                         { name: 'CanDelete', type: 'string' },
                         { name: 'CreatedDate', type: 'string' }],
            id: 'Id',
            url: url
        };
        var dataAdapter = new $.jqx.dataAdapter(source);
        $("#jqxgrid").jqxGrid({
            width: 670,
            source: dataAdapter,
            theme: theme,
            columnsresize: true,
            columns: [{ text: 'Name', datafield: 'Name', width: 250 },
                      { text: 'Comments', datafield: 'Comments', width: 250 },
                      { text: 'CreatedBy', datafield: 'CreatedBy', width: 180 },
                      { text: 'CanDelete', datafield: 'CanDelete', width: 120 },
                      { text: 'CreatedDate', datafield: 'CreatedDate', minwidth: 120 }]
        });
    });

Regards,
Gowri

[GowriParticipant]

Sorry, Lasttime I’m unable to submit script reference, Please refer below..

src=”../../jqwidgets/jqxcore.js”
src=”../../jqwidgets/jqxbuttons.js
src=”../../jqwidgets/jqxscrollbar.js
src=”../../jqwidgets/jqxmenu.js
src=”../../jqwidgets/jqxgrid.js
src=”../../jqwidgets/jqxgrid.selection.js
src=”../../jqwidgets/jqxgrid.columnsresize.js
src=”../../jqwidgets/jqxdata.js
src=”../../scripts/gettheme.js

[GowriParticipant]

Hi peter,
I just followed the steps, given in the documentation.
please check below refered scripts

JQuery and Knockout

then In my document.ready

$(document).ready(function () {
var theme = getDemoTheme();
var url = “Controller/Action”;
// prepare the data
var source = {
datatype: “json”,
datafields: [{ name: ‘Name’, type: ‘string’ },
{ name: ‘Comments’, type: ‘string’ },
{ name: ‘CreatedBy’, type: ‘int’ },
{ name: ‘CanDelete’, type: ‘string’ },
{ name: ‘CreatedDate’, type: ‘string’ }],
id: ‘Id’,
url: url
};
var dataAdapter = new $.jqx.dataAdapter(source);
$(“#jqxgrid”).jqxGrid({
width: 670,
source: dataAdapter,
theme: theme,
columnsresize: true,
columns: [{ text: ‘Name’, datafield: ‘Name’, width: 250 },
{ text: ‘Comments’, datafield: ‘Comments’, width: 250 },
{ text: ‘CreatedBy’, datafield: ‘CreatedBy’, width: 180 },
{ text: ‘CanDelete’, datafield: ‘CanDelete’, width: 120 },
{ text: ‘CreatedDate’, datafield: ‘CreatedDate’, minwidth: 120 }]
});
});
Error occured in below line

new $.jqx.dataAdapter(source);

In console it says that $.jqx is undefined.

Am I doing anything wrong..? or missed any reference..?

Thanks
Gowri

[GowriParticipant]

Hi,
I’m using JQWidgets 3.0.1 and I have refered all JQX references and knockout.js also.But still it throws $.jqx is undefined. Can any one help me out of this.

[Author]

Posts