In Jqgrid you apply a required attribute to any given field like this

 { name: 'Comments', index: 'Comments', editable: true, editrules: { required: true }, edittype: 'textarea' }

How would I go about doing this dynamically? I'd like to make a field required, based on another field (like the selected value of a dropdown/bobox)

I know where to place the code, eg, my dropdown's select event. But not how to apply the required attribute in any other way other than the code sample I supplied..

In Jqgrid you apply a required attribute to any given field like this

 { name: 'Comments', index: 'Comments', editable: true, editrules: { required: true }, edittype: 'textarea' }

How would I go about doing this dynamically? I'd like to make a field required, based on another field (like the selected value of a dropdown/bobox)

I know where to place the code, eg, my dropdown's select event. But not how to apply the required attribute in any other way other than the code sample I supplied..

• javascript
• jquery
• jquery-ui
• jqgrid
• jqgrid-asp

1 Answer 1

I suggest that you use some event to monitor the changes in the select control and change the value of the required option of editrules.

For example in the demo I used 'focusout' event on the select control of 'ship_via' column to change the required option of editrules of the column 'note'. I used the 'focusout' event because the code used the bug fix which I suggested here. You can use other events alternatively, but you should test there in different browsers.

The code which I used in the demo is

{name: 'ship_via', index: 'ship_via', width: 105, align: 'center', editable: true,
    formatter: 'select', edittype: 'select', editoptions: {
        value: 'FE:FedEx;TN:TNT;IN:Intim',
        defaultValue: 'IN',
        dataEvents: [
            {
                type: 'focusout',
                fn: function (e) {
                    $grid.jqGrid('setColProp', 'note', {
                        editrules: {required: ($(e.target).val() !== "IN")}
                    });
                }
            }
        ]
    },
    stype: 'select', searchoptions: {
        sopt: ['eq', 'ne'],
        value: ':Any;FE:FedEx;TN:TNT;IN:IN'
    } },
{ name: 'note', index: 'note', width: 60, sortable: false, editable: true,
    edittype: 'textarea' }