[MadhuriParticipant]

Hi Peter,

Thankyou for such a quick reply.I am trying to find a fix for this.Can you please give me any link having setcellvalue method.

Regards,

[MadhuriParticipant]

[MadhuriParticipant]

Sorry I need to update this also

After selection of value of editor.jqxComboBox and click outside of grid, selected value is not visible.

[MadhuriParticipant]

Hi,
I am using jqxgrid, this is custom grid has a column having drop down (editor.jqxComboBox()), for deletion we are using a checkbox column, everything is working fine with the checkbox selection and deletion, I am facing problem when I select value of dropdown and click anywhere on page value of grid is not visible it is hide.
I have put in selectionmode: ‘singlecell’, When I use ‘singlerow’ then this problem is resolved but delectation of row with help of check box selection is not work and when I use selectionmode: ‘checkbox’ then after check box selection values of rows are bold and highlighted which is wrong .
So I am using selectionmode: ‘singlecell’ then how I can resolved the issue of visibility of selected column value of editor.jqxComboBox().
Please suggest?

My sample code like this —
$(“#jqxgridForFieldSec”).jqxGrid(
{
width:”750px”,
source:dataAdapterForFieldSec,
//selectionmode: ‘checkbox’,
editable:true,
selectionmode:’singlecell’,
autoheight:true,

columns:[
{ text:”, datafield:’available’, columntype:’checkbox’, width:”50px”, check: true},
{text: <js:string><fmt:message key=”LBL_GROUP”/></js:string>, datafield:’description’, width:’300px’, displayfield:’description’, align:’center’, columntype:’combobox’,
createeditor:function (row, column, editor) {
// assign a new data source to the combobox.
var comboArray = new Array();
var count = 0;
<c:forEach items=”${groupListForFieldSec}” var=”item” varStatus=”status”>
var comboValue = {};
comboValue[“value”] = <js:string>${item.id}</js:string>;
comboValue[“label”] = <js:string>${item.description}</js:string>;
comboArray[count] = comboValue;
count++;
</c:forEach>

var comboSource =
{
datatype:”array”,
localdata:comboArray,
datafields:[
{ name:’label’, type:’string’ },
{ name:’value’, type:’string’ }
]
};
var dropDownAdapter = new $.jqx.dataAdapter(comboSource);
editor.jqxComboBox({source:dropDownAdapter, displayMember:’label’, valueMember:’value’,enableBrowserBoundsDetection: true});

},

cellvaluechanging:function (row, column, columntype, oldvalue, newvalue) {

saveFieldFlag = true;

if (newvalue == “”) return oldvalue;
var selectedValue = document.getElementsByName(‘comboboxeditorjqxgridForFieldSecdescription’)[0].value;
var input = document.createElement(“input”);

input.setAttribute(“type”, “hidden”);
input.setAttribute(“name”, “jqxFieldSecurityComboBox” + selectedValue);
input.setAttribute(“value”, selectedValue);
document.getElementById(“fieldPropForm”).appendChild(input);

// alert(“existingViewId>” + selectedValue);
}
},

{ text: <js:string><fmt:message key=”LBL_READ”/></js:string>, datafield:’read’, width:’100px’, align:’center’, editable:false},
]

});

[MadhuriParticipant]

Hi,

I am creating a grid with one column as a checkbox. When we click a link named “Add new row” a new row gets added to the grid.
Now I want to assign a unique id and name to the checkbox every time when row is created.
Please let me know how to do this.

[MadhuriParticipant]

Hi Peter,

could you please provide example on which multiple column are populated with checkboxes , how we can read these checkboxes data and how we can populate it, we were not getting this type of examples that’s why using custom HTML checkboxes in grid.
Below examples only useful to delete multiple row selection with checkbox and here only one column is populate with checkbox so it is easy to maintain data of checkbox.

http://www.jqwidgets.com/jqxgrid-with-checkbox-based-rows-selection/
http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/index.htm#demos/jqxgrid/cellediting.htm

In my grid one column is dropdown and another 4 column are populated with checkboxes so I am not getting how I can pass these column check box data to server and how we can populate these checkbox data from server to client, if you have any example to meet similar requirement these please give?

Thanks .

[MadhuriParticipant]

I am using selectionmode:’singlecell’

[MadhuriParticipant]

thanx Nagoor

Have included cellendedit function already.

Solved my problem by using selection mode as single cell.
using single row created the same problem as earlier.

[MadhuriParticipant]

my code is like this:-

 
 /*grid is being created here*/
 
 var sourceForField =
    {
        localdata: dataForField,
        datatype: "array",
        datafields:
                [
                    { name: 'available', type: 'bool' },
                    { name: 'description', type: 'string' },
                    { name: 'readP', type: 'string' },
                    
                ]  ,
        deleterow: function (rowid, commit) {
            commit(true);
        }
    };
    var dataAdapterForField = new $.jqx.dataAdapter(sourceForField);

    $("#jqxgridForField").jqxGrid(
            {
                width:outsideWidth - 64,
                height:outsideHeight - 64,
                // pageable:true,
                // pagesize:5,
                source: dataAdapterForFieldSec,
                editable: true,
                selectionmode: 'checkbox',
                autoheight: true ,

                columns: [
                    { text: '', datafield: 'available', columntype: 'checkbox', width: 46 },
                    {text: <js:string>GROUP</js:string>, datafield: 'description',width: '56%', displayfield: 'description', align:'center', columntype: 'combobox',
                        createeditor: function (row, column, editor) {
                            // assign a new data source to the combobox.
                            var comboArray = new Array();
                            var count = 0;
                            <c:forEach items="${groupListForFieldSec}" var="item" varStatus="status">
                            var comboValue = {};
                            comboValue["value"] = <js:string>${item.id}</js:string>;
                            comboValue["label"] = <js:string>${item.description}</js:string>;
                            comboArray[count] = comboValue;
                            count++;
                            </c:forEach>
								/*combobox being created*/
                            var comboSource =
                            {
                                datatype: "array",
                                localdata: comboArray,
                                datafields: [
                                    { name: 'label', type: 'string' },
                                    { name: 'value', type: 'string' }
                                ]
                            };
                            var dropDownAdapter = new $.jqx.dataAdapter(comboSource);
                            editor.jqxComboBox({source: dropDownAdapter,displayMember: 'label', valueMember: 'value'});

                        },  cellvaluechanging: function (row, column, columntype, oldvalue, newvalue) {

                        saveFieldFlag=true;
						/*combobox value being fetched*/
                        if (newvalue == "") return oldvalue;
                        var selectedValue = document.getElementsByName('comboboxeditorjqxgridForFieldSecdescription')[0].value;
                        
                        var input = document.createElement("input");

                        input.setAttribute("type", "hidden");
                        input.setAttribute("name", "jqxFieldSecurityComboBox" + selectedValue);
                        input.setAttribute("value", selectedValue);
                        document.getElementById("fieldPropForm").appendChild(input);
}

/*function for removing rows*/
function removeRow() {
    var selectedrowindexes = $('#jqxgridForFieldSec').jqxGrid('getselectedrowindexes');
    var rowscount = $("#jqxgridForField").jqxGrid('getdatainformation').rowscount;

    selectedrowindexes.sort();
    for (var m = 0; m < selectedrowindexes.length; m++) {
        var selectedrowindex = selectedrowindexes[selectedrowindexes.length - m - 1];

        if (selectedrowindex >= 0 && selectedrowindex < rowscount) {
            var id = $("#jqxgridForField").jqxGrid('getrowid', selectedrowindex);
            var selectedValue = $('#jqxgridForField').jqxGrid('getrowdata', id).description;
            var input = document.createElement("input");
            input.setAttribute("type", "hidden");
            input.setAttribute("name", m+"~"+"jqxFieldSecurityRemove");
            input.setAttribute("value", selectedValue);
            document.getElementById("fieldPropForm").appendChild(input);
            var commit = $("#jqxgridForField").jqxGrid('deleterow', id);
        }
        // commit(true);
    }
}

[Author]

Posts