how to disable the plus icon from jqgrid?

Question

I want to disable the plus icon from my jsp page when the request is made to this page. How to do this?

I tried this

if ($("#errorMsgForItem").val() == "noloc") 
                    {
                        $("#add_" + myGrid[0].id).addClass('ui-state-disabled');
                        console.debug("No Item location found...");

                    }

Update: More code

This is a function(createNew) which will be called on the same page After submitting a form via AJAX

function createNew(aDateVal){
$("#searchProductDiv").css("display","block");
     $("#itemfilterParamDiv_org").css("display","none");
$('#createNewInventoryBlock').dialog('close');
 $("#saveSubgridItem").show();

 if(aDateVal == null || aDateVal == ""){
        $("#dateValidationMsg").html("Enter date");
        $("#saveSubgridItem").hide();
      }else{
          blockPanel("centerPanel");
         $.ajax({
          url: "validationAgainstExistData.htm?date="+aDateVal+"&dateFormat="+controllerDateFormat,
          success: function(data){
            $("#errorMsgForItem").val( $.trim(data));
                if ($("#errorMsgForItem").val() == "yes") 
                {
                    $("#dateValidationMsg").hide();
                    $("#errorMsgDisplay").show();
                    $("#errorMsgDisplay").html("Inventory for the selected date already exists. Click on the inventory date to open it for edit."); 
                    $("#centerPanel").unblock();
                }else{

                    //$("#itemLocationGrid").jqGrid("navGrid", "#itemLocationGridPager", {add: false});
                    var msg =null;
                    $("#dateValidationMsg").hide();
                    $("#errorMsgDisplay").hide();
                     $("#itemLocationGridContainer").show();
                       loadItem(aDateVal,msg);
                    $("#categoryDisplayId").show();
                    $("#modifiedUserLabelId").show();
                    $("#userListDisplayTitleId").show();
                    //$('#itemLocationGrid').jqGrid().trigger('reloadGrid');
                    //$("#itemLocationGridContainer,#itemLocationGrid").jqGrid("navGrid", "#itemLocationGridPager", {add: false});

                    var myGrid = jQuery("#itemLocationGridContainer");//itemLocationGrid
                    $("#edit_" + myGrid[0].id).addClass('ui-state-disabled');
                    $("#del_" + myGrid[0].id).addClass('ui-state-disabled'); 
                    $("#add_" + myGrid[0].id).addClass('ui-state-disabled'); //nothing happening


                    $("#centerPanel").unblock();  
                       // $("#createNewInventoryBlock").dialog({autoOpen: true });
                    }
              }
        }); 
    }

}

html

<div id="searchProductName" style="display:none"></div>
<div id="itemLocationGridContainer" style="float:left;margin-top: 20px;display:none" >
    <p class="ui-widget" style="font-size: 12.5px;color: blue;">During editing a cell, do not drag the rows for rearranging.</p>
     <table id='itemLocationGrid'></table>
     <div id='itemLocationGridPager'></div>
     <div id ="addProduct" style="display:none;background-color:#DFEFFC;width:340px;height:auto;opacity: 0.99;filter:alpha(opacity=65);"></div>
      <div id ="productItemLocationId" title="Location "></div>
      <div style="display: none;" id="calculateItemSummariesBasedOnItemCategory"></div>
</div>

score 0 · Accepted Answer · edited May 23 '17 at 11:57

0

addClass('ui-state-disabled') disables the Add button instead of hiding. You can use jQuery.hide to hide it instead:

var myGrid = $("#grid");

// hide Add button
$("#add_" + myGrid[0].id).hide();

I should remark that you should use above code only if you need **dynamically* show or hide add button. If you don't need the button you should just use add: false option of navGrid method:

// create navigator with Edit and Delete buttons, without Add button
$("#grid").jqGrid("navGrid", "#pager", {add: false});

If you do need dynamically hide/show some navigator buttons you should create all the buttons and hide/show the buttons when it's require. See the answer and another one for demos which explain more detailed the working with navigator buttons.

edited May 23 '17 at 11:57

Community

1
1

answered Jan 16 '14 at 14:09

Oleg

220,925
34
403
798

Thank you for your help. I just edited my question. I am wondering how can i make my grid "add" icon `disable` ? You have shown removing & hidding plus icon. But i am looking for disabling it.. Is this possible? – Dan Jan 16 '14 at 17:27
@Sundara: It would be better if you post more your code. Moreover the text "when the request is made to this page" is unclear. In any way if you want to disable the Add icon of the navigator the line `$("#add_" + myGrid[0].id).addClass('ui-state-disabled');` could be correct. It should be just be used *in correct place*, `myGrid` variable should be initialized correctly and the `id` of the grid should don't contain any special characters. So if you code still don't work you should include it in the text of your question. – Oleg Jan 16 '14 at 19:11
I even tried this `$("#grid").jqGrid("navGrid", "#pager", {add: false});` But it seems not functioning. I tested wih this `$("#itemLocationGrid").jqGrid("navGrid", "#itemLocationGridPager", {add: false}); ANd even i added this also `var myGridd=jQuery("#itemLocationGridContainer"); $("#add_" + myGridd[0].id).addClass('ui-state-disabled');` but no effect – Dan Jan 16 '14 at 19:27
I added more code in my above question. Please review it. I am still unable to disable/hide the add icon from grid. Please help – Dan Jan 16 '14 at 19:38
@Sundara: you use `var myGrid = jQuery("#itemLocationGridContainer")` in your code instead of `var myGrid = jQuery("#itemLocationGrid")`. It's the first error. Instead of `$("#add_" + myGrid[0].id)` you can use `$("#add_itemLocationGrid")` directly. Moreover it's important the order of statements. One can create the grid **only once** and one can call `navGrid` also **only once**. The current code don't contains the part of the code you should validate that `$("#add_itemLocationGrid").hide();` will be called *after* `navGrid`. – Oleg Jan 16 '14 at 19:47

how to disable the plus icon from jqgrid?

1 Answers1