0

I have a free JqGrid setup in such a way such that onclick of the row, editgridrow is called and the form loads. Now when the user changes the value of a certain field on the form, I want to be able to show/hide other fields depending upon what was defined in the editable parameter of the colModel.

I have defined the dataEvents in the cmTemplate part of the grid, so that any change any where on the form will trigger the event. I have also gotten to the colModel. What I am unsure of is how to apply the rule inside of the ColModel to that particular row being edited.

        cmTemplate: { 
                      align: "center", 
                      autoResizable: true,
                      editrules: {edithidden: true},
                      editoptions:{
                            dataEvents: [
                                         {
                                             type: 'change',
                                             fn: function(e) {
                                                var form = $(e.target).closest('form.FormGrid');
                                                handleEvent(e.target.id,e.target.value,form[0],$(newTable).jqGrid())

                                             }
                                         }
                             ]

                     }
                },



        function handleEvent(eventSource,eventSourceValue,form,grid)
        {

             var targets = eventSources[eventSource];
             if(targets != null)
             {
                var colModel = grid.getGridParam("colModel");

                for(var i=0; i<targets.length;i++)
                {
                    for(var z=0; z<colModel.length;z++)
                    {   
                        if(colModel[z]["name"] == targets[i])
                        {

                            if(colModel[z]["edittype"] == "select")
                            {
                                var dropdownName = "drp"+targets[i].replace("-","_");

                                var newOptions = buildOptions(eval(dropdownName),eventSourceValue);

                                $("select#"+targets[i]+".FormElement", form).html(newOptions)
                            }
                            break;
                        }
                    }
                }   
            }





        }

I have already handled other dropdown changes in the handle event BUT I also need to be able to handle all other changes to the form , for example showing fields etc but I do not want to write duplicate code again and want to access the editOptions of the colModel and trigger the change to the form

Raghavan Mohan
  • 3
  • 4
  • @Oleg need your help on this..This is kind of urgent.. PLEASE help – Raghavan Mohan Jul 10 '19 at 14:13
  • @Tony Tomov your input would be extremely valuable as well – Raghavan Mohan Jul 10 '19 at 14:16
  • Where show/hide fields? In grid or in the edit form. Note that if set some option in colModel during editing of certain column you can not use it, since rules are already read. You can show hide fields dynamically on the form which has certain id - but since you use free-jqGrid I can not tell you how this id is build ed. You will need to read the docs for free-jqGrid – Tony Tomov Jul 11 '19 at 07:34
  • How to show or hide fields dynamically on the form without rewriting the rules that have already been written in the colModel? – Raghavan Mohan Jul 11 '19 at 13:11
  • Please search the stack before to ask! You may look into this [post here](https://stackoverflow.com/questions/4645787/jqgrid-show-hidden-column-in-form-view). This rules apply to edit form too. [This](https://stackoverflow.com/questions/2368051/jqgrid-how-to-have-hidden-fields-in-an-edit-form/2394411#2394411) will help too – Tony Tomov Jul 12 '19 at 15:31
  • @TonyTomov, Please believe me, I have looked at those posts already. Those don't help me.. Let me explain: Let us say my colModel is: { name:name1, editable:function(options){ return type==1; } }, { name:name2, editable:function(options){ return type==1; } }, { name:name3, editable:function(options){ return type==2; } }, { name:name4, editable:function(options){ return type==2; } Now on editGridRow ... I change type from 1 to 2, without doing all the hide and show, how to reload the form with name3 and name4? – Raghavan Mohan Jul 15 '19 at 21:19

1 Answers1

0

First option is to use the event beforeInitData (the event is defined within editGridRow - see docs) here you can change the type and your columns will show and hide in the form depending on your conditions

Second option in your case is to define custom button in navigator and call editGridRow to edit a row and before edit the row you can change the status of the variables as you want. See how to use custom button add here

I should note that the above recommendations are based on supported product Guriddo jqGrid , since you use not supported free-jqGrid you should take this in care when try these.

Tony Tomov
  • 3,122
  • 1
  • 11
  • 18
  • I am sorry, but I do not think you get my question.. AFTER calling editGridRow and the form has been loaded, and all fields on the form have been displayed, I want to show and hide fields on the form based on other fields changing and it basically has to call editable , so that the "display rules" are defined in editable. I am not sure either Guriddo jqGrid or free JqGrid have this feature. I am sure this is much desired feature among all developers – Raghavan Mohan Jul 16 '19 at 18:29
  • Sure. In the current implementation to show and hide form rows as per your requirement it is possible only in the way described above in my first post (see links) - to show and hide it when some value changes. Changing the option to editable have no effect since the form options are already read. Guriddo jqGrid does not make everything as per user requirements - this is not possible at all, but it has a instruments and features to make almost everything possible with little effort and programming. – Tony Tomov Jul 16 '19 at 20:24