简体   繁体   中英

Alert selective datafield in jQWidget Grid on hyperlink click event

I am working on JQWidget grid. In each row I have record ID along with other fields there is two things I want to do, (I have done first part, code been updated... is anyone know about part 2 of this question????)

1- make name column in row hyperlink 2- when column cell with hyperlink click, script read the ID of record which in my case 'dataField =StudentDBID' and alert these information.

        function BindStudentListToGrid(data)
    {
        var DataSource =
       {
           datatype: "json",
           datafields: [
               { name : 'StudentDBID'},
               { name: 'RelationshipID' },
               { name: 'Studentid' },
               { name: 'Unite_id'},
               { name: 'Date_start' },
               { name: 'Date_end' },
               { name: 'FullName' },
               { name: 'Locality' }
           ],
           id: 'ID',
           localdata: data,
           async: false,

       };

        var dataAdapter = new $.jqx.dataAdapter(DataSource);

        $("#StudentListInRelationToStaffGrid").jqxGrid(
        {
            source: dataAdapter,
            theme: 'classic',
            width: '100%',
            sortable: true,
            pagesize: 2,
            pageable: true,
            autoheight: true,
            columns: [
                { text: 'StudentDB ID', datafield: 'StudentDBID', hidden: true },
                { text: 'Relationship ID', datafield: 'RelationshipID', hidden: true },
                { text: 'Student ID', datafield: 'Studentid', hidden: true },
                { text: 'Unite ID', datafield: 'Unite_id', hidden: true },
                { text: 'From', datafield: 'Date_start', width: 200 },
                { text: 'To', datafield: 'Date_end', width: 200 },
                { text: 'Name', datafield: 'FullName', cellsrenderer: linkrenderer },
                { text: 'Locality', datafield: 'Locality' }
            ]
        });


    }


var linkrenderer = function (row, column, value) {

        return "<a href=#>" + value + "</a>";
    }

    $('#StudentListInRelationToStaffGrid').on('cellclick', function (event) {

        if (event.args.datafield == "FullName")
        {
            alert("A cell has been clicked:" + event.args.rowindex + ":" + event.args.datafield + event.args.value );
        }

    });

my data is coming in json format

In order word, how can read column field by row index as I can get that using click event???

here is complete answer

        $("#StudentListInRelationToStaffGrid").jqxGrid(
        {
            source: dataAdapter,
            theme: 'classic',
            width: '100%',
            sortable: true,
            pagesize: 2,
            pageable: true,
            autoheight: true,
            columns: [
                { text: 'StudentDB ID', datafield: 'StudentDBID', hidden: true },
                { text: 'Relationship ID', datafield: 'RelationshipID', hidden: true },
                { text: 'Student ID', datafield: 'Studentid', hidden: true },
                { text: 'Unite ID', datafield: 'Unite_id', hidden: true },
                { text: 'From', datafield: 'Date_start', width: 200 },
                { text: 'To', datafield: 'Date_end', width: 200 },
                { text: 'Name', datafield: 'FullName', cellsrenderer: linkrenderer },
                { text: 'Locality', datafield: 'Locality' }
            ]
        });


    }


    var linkrenderer = function (row, column, value) {

        return "<a href=#>" + value + "</a>";
    }

    $('#StudentListInRelationToStaffGrid').on('cellclick', function (event) {

        if (event.args.datafield == "FullName")
        {
            alert("A cell has been clicked:" + event.args.rowindex + ":" + event.args.datafield + event.args.value);

            var datarow = $('#StudentListInRelationToStaffGrid').jqxGrid('getrowdata', event.args.rowindex);

            alert(datarow.StudentDBID);
        }

    });

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM