ParamQuery grid support forum

General Category => Help for ParamQuery Grid (free version) => Topic started by: lalitsingh on December 26, 2013, 12:20:45 pm

Title: use select input on grid
Post by: lalitsingh on December 26, 2013, 12:20:45 pm

Hi,

I am using http://paramquery.com/demos and using CRUD on grid. here i see all are input text. i want to use option set (select box) on grid. how can i achieve this ?


Regards,
Lalit

Title: Re: use select input on grid
Post by: paramvir on December 26, 2013, 08:57:07 pm

You have to do little bit of coding.

http://paramquery.com/demos/crud_remote
http://paramquery.com/Content/js/pqGridCrud.js

There is a for loop in _create method to enumerate through the colModel

for(var i=0;i<colModel.length;i++){
      var column = colModel;
      strPopup += "<tr>\
     <td class='label'>"+column.title+":</td>\
     <td><input type=text name='"+column.dataIndx+"' /></td>\
     </tr>";
}

You would need to replace <input type=text name='"+column.dataIndx+"' />

with <select name='"+column.dataIndx+"' /><option>Option 1</option><option>Option 2</option></select>

To generalize it

You may add a flag to the column while defining colModel i.e
{ editor: 'select', options: [ 'Option1', 'Option2', 'Option3' ] }

Title: Re: use select input on grid
Post by: lalitsingh on December 27, 2013, 11:39:29 am

Thanks for your valuable reply.

i am able to find the for loop in edit row section. i am able to achieve the dropdown on popup window , but after adding it shows text value on grid, not dropdown. for your understanding below is my html table. can you guide me if you have such template or demos

<table id="market_table" style="width: 100%; display: none;">
        <thead>
            <tr>
                <th>H1</th>
                <th>H2</th>
                <th>H3</th>
                <th>H4</th>
                <th>H5</th>
                <th>H6</th>
            </tr>
        </thead>
        <tbody id="tableID">
            <tr>
                <td>
                    <input name="listofprojects" type="text"></td>
                <td>
                    <select name="source">
                        <option>Solicited</option>
                        <option>Proactive</option>
                    </select></td>
                <td>
                    <select name="solicited">
                        <option>Defend</option>
                        <option>Attack</option>
                    </select></td>
                <td>
                    <select name="segment">
                        <option>Fine Fragrance</option>
                        <option>Body Care</option>
                        <option>Home Care</option>
                    </select></td>
                <td>
                    <select name="sugbsegment">
                        <option>BA - AntiP/Deo</option>
                        <option>BH - Hair Care</option>
                        <option>BK - Skin Care</option>
                        <option>BO - Oral Care</option>
                    </select></td>
                <td>
                    <input name="potential" type="text"></td>
            </tr>


        </tbody>
    </table>