jqGrid, checkbox not aligned to left on edit form. Bootstrap

1
votes

I'm using jqGrid JS v5.3.0, with styleUI set to Bootstrap. On edit form, the checkbox (created by setting edittype option. also set editoptions: {value:"true:false"}) is aligned to the center of the form. Is there a way to make it align to the left?

Thanks in advance.

1
jqgrid

1 Answers

0
votes

The reason for this is the setting in the bootstrap css

.EditTable td input, 
.EditTable td select, 
.EditTable td textarea { 
    width: 98%; 
    display: inline-block;
}

i.e this is caused from width:98%

To correct this there are a lot of ways.

The first one is to use editoptions to set a manual auto width with style options.

edittype : 'checkbox',
editoptions : {value:"true:false", "style":"width:auto"},

The second one (more elegant IMHO) is to set this in css for all check-boxes in the edit form like this:

<style>
    .EditTable td input[type="checkbox"] 
    {
        width :auto;
    }
</style>

after loading the jqgrid bootstrap css file.