I need to add pagination feature to few of my DataGrids
and I am just moving ahead step by step.
To begin with I tried setting 'rowsPerPage' attribute
of DataGrid to some value, say 5. But it has no impact on the
displayed grid. I mean number of rows displayed are more than
the value set to 'rowsPerPage'.
<table dojoType="dojox.grid.DataGrid" store="tags" rowsPerPage =3
style="width: 100%; height: 500px;">
<thead>
<tr>
<th width="150px" field="dept">Namey</th>
<th width="150px" field="name">Depty</th>
</tr>
</thead>
</table>
Please tell me how to show only 3 results only per time .
I have been searching web since morning but to no avail.
Any inputs will be highly appreciated.
Please help .
The rowsPerPage property actually doesn't control the number of items show in the grid. It controls the number of rows loaded as you scroll through the grid. Default is 25, and that's usually pretty good.
What you want to do is set the autoHeight property on the grid to the number of rows you want to show. It's kind of an interesting property because it can be set to "true" which will expand your grid to show all data rows, or it can be set to a number (like 3) and then it will only show that many rows, and create a scroller for your grid if your data store has more than that number of rows.
(I know this is probably a late answer, but found this while researching another grid question, and thought I'd throw it out there.)
Related
I have this fiddle and you can see that when you input any value for price field , It's popup tip is not positioned on the text because its data type is number as when you input values for Names.
https://jsfiddle.net/6da007fm/21/
HTML
<table data-toggle="table"
data-editable-emptytext="This field is empty"
data-id-field="id"
data-url="/gh/get/response.json/wenzhixin/bootstrap-table/tree/master/docs/data/data2/">
<thead>
<tr>
<th data-field="name" data-editable="true" >Name</th>
<th data-field="price" data-editable="true" data-editable-emptytext="For free." data-editable-type="number" data-editable-placeholder="Enter a Number">Price</th>
JS
$.fn.editable.defaults.mode = 'popup';
Is it a normal behavior or there is any workaround to this. I am using this in my project web page and it has 5 columns in one row and is not looking very neat because of this.
-Thanks
you just need to override popovers core css
.popover{
left:190px!important
}
here is your updated fiddle Working demo
I am using datatables and am wondering if there is an option to make the header wrap.
i use compact display
the problem is, some javascript sets the width of the table header cells to a fix number of pixels.
so i want:
fees
covered
name
shown
amount
shown
in the headers
EDIT: the problem with adding a <br/> tag is that the width of the columns stay exactly the same, but i want them to become smaller, less width, see here:
Use line break <br> in the table header:
<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>fees<br>covered</th>
<th>name<br>shown</th>
<th>amount<br>shown</th>
</tr>
</thead>
</table>
See this jsFiddle for code and demonstration.
Depending on how your table is initialised then you could use an adaption of the title key within a columns definition:
"title": "Your Title".split(" ").join("<br/>"), // Your<br/>Title
Example JSFiddle here.
Automate an application through selenium where id changes dynamically.how can i handle this.Pls help me..
HTML code is:-
<table border="0" cellpadding="0" cellspacing="0" width="1000px">
<tbody><tr id="ctl00_ctl00_MainContent_CarQuoteMainContent_rpQuotes_trSelectedQuote_0">
<td align="center" valign="middle" width="12%">
<input id="ctl00_ctl00_MainContent_CarQuoteMainContent_rpQuotes_chkCompare_0" name="ctl00$ctl00$MainContent$CarQuoteMainContent$rpQuotes$ctl00$chkCompare" type="checkbox">
</td>
In both the cases ( and ), I assume that the first part of the ID is unique. So you can use something like this.
//tr[contains(#id,'ctl00_')] and for input field //input[contains(#id,'ctl00_')].
Those don't look like dynamic IDs, but rather non-content-specific row IDs for elements in a list.
If that's the case, you can't immediately ascertain 'This row element is displaying data for MyCarQuotes.com' from this information alone as there's nothing in the HTML shown to base that query on.
If there's something in the rows you can use to 'identify' the content (eg a company name) - and you have a specific 'thing' you want to interact with - you could encapsulate the lookup and do something like
CheckboxForQuoteFromCompany("MyCarQuotes.com").Click();
If you're able to post more of the HTML (at least a full row), and more importantly the intention of your test, we may be able to be of more help.
Currently i am getting 100 Records from my Servlet .
I want to display only 20 Records per page , i am using dojox.grid.DataGrid , but still its displaying all the 100 Records
Please help .
<body class=" claro ">
<span dojoType="dojo.data.ItemFileReadStore" jsId="store1" url="http://localhost:8080/Game/servlet/Hi"></span>
<table dojoType="dojox.grid.DataGrid" store="store1" rowsPerPage="20" rowSelector="20px"
style="width: 100%; height: 500px;">
<thead>
<tr>
<th width="150px" field="name">Namer3</th>
<th width="150px" field="dept">Deptr3</th>
</tr>
</thead>
</table>
</body>
I would suggest you start using a QueryReadStore, and change your servlet to respect the start and count parameters that are part of the post. This will allow the grid to fetch the rows 1-20, then 21-40 when the user scrolls down, and so forth.
If you're looking to tell the grid to render only 20 rows at a time and wait for a scroll event for the others, that should already be handled. I would suggest you double check your grid. Initially 20 rows should be rendered with values, and the later ones should just have "..." inside all the values until scrolled into view.
I'm using Struts2 iterator to setup a list of checkbox in a table. I want to have 10 checkbox per row, so I'm doing the following:
<table>
<tr>
<s:iterator value="securityMasterFields" status="fieldNameStatus" var="fieldName">
<s:if test="#fieldNameStatus.index % 10 ==0">
</tr><tr>
</s:if>
<td>
<s:checkbox name="fieldsToShow" fieldValue="%{fieldName}" value="%{fieldName}"/>
</td>
</s:iterator>
</tr>
</table>
It never goes through the if, so I'm assuming the mod is not been calculated correctly. How do I do it?
thanks
Well, I had to add some parentheses and it worked correctly. The loop was working, it was just that it wasn't going through the if.
<s:if test="(#fieldNameStatus.index % 8 )==0"></tr><tr></s:if>
It looks good to me. Two thoughts:
1) try printing the result of the test in s:property tag
2) It looks like you will have empty table rows... Are you looking at the generated html or just the output, because if it is just the output then unless you have some CSS giving you some table padding and borders, without an empty 'td' element the row might collapse and make it appear as if nothing is being added. So do make sure you print the empty 'td' elements too!