Will bootgrid work with non-numeric column-id as data-identifier - jquery-bootgrid

will bootgrid work with non numeric column-id as the identifier, if its a unique value?
<th data-column-id="mytextid" data-identifier="true">Unique Text ID</th>
Will selection="true" work for instance? Or do I need a numeric value for the identifier column?

OK tried it in fiddle. You can have a non numeric data-identifier. (IMHO it should be called data-row-identifier...)
In order to access that column you simply use the name you set in the data-column-identifier, so:
<!-- works!! even without data-type="numeric" -->
<th data-column-id="myid" data-identifier="true">My ID</th>
<th data-column-id="info">Info</th>
</tr>
</thead>
and the code should be
$("#mygrid").bootgrid(
{
// other settings... and:
selection: true
}).on("selected.rs.jquery.bootgrid", function(e, rows)
{
alert("Selected: " + rows[0].myid);
});
Here's a jsfiddle to prove the point

Related

How to display connected table data in blade view

I have 2 tables that have a many to many relation ship
Members: id, name , ...
Locations: id,location_id
Connected by a pivot table
members_location: member_id, location_id
in my Location model I have the following function
public function members(){
return $this->belongsToMany('App\Member','location_member','location_id','member_id');
}
LocationController.php Passes data to the blade template
$locations = Location::All();
return view('locations.overview',['locations' => $locations]);
So in my overview.blade.php i do the following
#include('includes.message-block')
<!-- get a list of locations -->
<table class="member_overview table table-striped table-hover">
<thead>
<tr>
<th>Naam</th>
<th>Locatie</th>
<th>Opmerking</th>
</tr>
</thead>
<tbody>
#foreach($locations as $location)
<tr>
<td>
{{$location->location_id}}
</td>
<td>
{{$location->members->id}}
</td>
<td>
</td>
</tr>
#endforeach
Which returns an error.
Undefined property: Illuminate\Database\Eloquent\Collection::$id (View: ...)
If i drop id property on:
<td>
{{$location->members->id}}
</td>
I get an array [{"id":1,"first_name":"Sa ..}]. how can I select the first_name property from that array
tinker output when selecting one location
$location->members
=> Illuminate\Database\Eloquent\Collection {#658
all: [
App\Member {#664
id: 1,
the belongsToMany relationship will return a collect not a single instance of an eloquent object.
To overcome this issue you will either have loop through the members e.g.
foreach($location->members as $member) ...
of if you just want the first one then you could do:
$location->members->first()->id
Also, just an FYI but you're going to end up with a potentially large number of DB calls due to the n+1 issue that comes with many-to-many relationships. To overcome this you can simple add a with method in your controller i.e.
$locations = Location::with('members')->get();
NB you must use get and not all (like above) if you have any other methods in the chain.
Hope this helps!

Knockout Viewmodel binding and Datatable Sorting

I'm using Knockout for data binding and using dataTable+YADCF for Sorting and filtering. My scenario is little complex, on clicking the Category nodes (left side) each time need to make an AJAX call and refresh the table data (right side) through Knockout. This Knockout binding functionality works fine without any issue.
HTML Code
<table class="pdm-data-table pdmList" id="ListCatAttrVal" data-link="row">
<thead>
<tr>
<th>Display Name</th>
<th>Display Source</th>
</tr>
</thead>
<tbody id="listAttribute" data-bind="foreach: attributevalue">
<tr>
<td data-bind="text: dispName"></td>
<td data-bind="text: dispSrc"></td>
</tr>
</table>
Knockout Model Code
if (!ko.dataFor(document.getElementById("listAttribute"))) {
var attributeModel = function () {
this.attributevalue = ko.observableArray();
};
attributeBinding = new attributeModel();
ko.applyBindings(attributeBinding, document.getElementById("listAttribute"));
}
Issue is after applying DataTable for the Table
$("#ListCatAttrVal").dataTable().fnClearTable();
for (var x in response.attributes) {
attributeBinding.attributevalue.push(response.attributes[x]);
}
$("#ListCatAttrVal").dataTable();
After this, Datatable Sorting is not working.
I'm trying to remove the existing generated dataTable and re-initiate it every-time when I click on the category node. But it is not working as expected.
I had a similar issue while working with knockout and datatables - my bindings inside the datatable don't seem to work initially. As a workaround I ended up initialising the datatable in the following way:
var table = $("#ListCatAttrVal").dataTable();
table.fnPageChange(0, true);
After calling fnPageChange (or any other function of datatable library, I believe) bindings seem to be working.

Identifying an WebTable/WebGrid Object in QTP

I have the below code in html for a WebTable(Web Grid).
<table width="90%">
<div class="greybox" style="margin-top:2%;">
<table class="datagrid" width ="100%">....<table>
</div>
</table>
I tried providing exactly the same(all) properties in my descriptive programming but the Web Element(DIV) is not being identified by QTP. Is there a unique way to identify this?
Note: The Web page is developed a single page application
Edit:
So I think I have resolved the issue with the below code. There were two Objects being identified without the "Unique Text" if clause. First Object was parent of the DIV object so had to use a "Unique text" from the first object which wouldn't be part of any other object. I am currently trying with different data to see if it's working fine
Browsername = Browser("micClass:=Browser").GetROProperty("name")
Pagename = Browser("micClass:=Browser").Page("micClass:=Page").GetROProperty("name")
Set desc = Description.Create()
desc("micclass").Value = "Webelement"
Set ChildObject=Browser("name:="&BrowserName).Page("name:="&PageName).ChildObjects(desc)
Set Child_Table_Value = nothing
For i=0 to ChildObject.Count-1
innerhtmlvalue = ChildObject(i).GetRoproperty("innerhtml")
htmltag = ChildObject(i).GetRoproperty("micclass")
if(Instr(innerhtmlvalue, "MARGIN-TOP: 2%")<>0) then
if(Instr(innerhtmlvalue, "UniqueText")=0) then
if(Instr(htmltag, "WebElement")<>0) then
Set Child_Table_Value = ChildObject(i)
End If
End If
End IF
Next
Set Table_Value = Child_Table_Value.WebTable("html tag:=Table")
Ok, so assuming you have an HTML structure something like this:
<table width="90%">
<tr>
<td>
<div class="greybox" style="margin-top:2%;">
<table class="datagrid" width="100%">
<tr>
<td>UniqueText</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
...and as per your current solution you can rely on "UniqueText" being present, then you could try the following XPath statement:
(//table[contains(., 'UniqueText')])[last()]
So in QTP/UFT you'd be doing:
Browser("micClass:=Browser").Page("micClass:=Page").WebTable("xpath:=(//table[contains(., 'UniqueText')])[last()]")
Try to use like below.(Try to identify the div block using the "class")
Browser("micClass:=Browser").Page("micClass:=Page").Webelement("class:=greybox").Webtable("class:=datagrid")
Please let me know

Add element to existing html using specific location using id and class using prototype insert

i am trying to add Element to existing html content using prototype insert. below is the html on which i am working
<table id="productGrid_table" class="data" cellspacing="0">
<thead>
<tr class="filter">
<th>
<div class="range">
</div>
</th>
</tr>
</thead>
here i want to add another < th> in < tr class="filter">, i am trying to achieve this using below prototype code
$('filter').insert("<th><div class='field-100'></div></th>");
please provide some suggestion what i am doing wrong here???
In PrototypeJS $('filter') selects element with id="filter". If you want to select by class, then use $$ function. Something like this:
$$('.filter')[0].insert("<th><div class='field-100'></div></th>");
But I'd recommend either changing class name to something more unique, or use id instead of class.

MVC3 Razor foreach problems

I've got a model that is returning a IEnumerable of football picks for a variable number of users. Due to this, I'm dynamically building an html table with a variable number of columns. Basically, my picks will come back like this. However, each game is going to be repeated for each User, so I'm only adding the first 3 columns of each table row once, and then adding only a single tag until the gameID changes. I know there are probably better ways to do this, but it's just a side project that I need to get done quickly. And, I just want to figure out why it's not working.
GameID
GameDateTimeDisplay
GameTeamDisplay
WinningTeamDisplay
PickedTeamAbbr
OK, so here is the insanity that doesn't work. I can get my table headers created successfully, but then the tbody isn't working, but it's erroring in an odd place.
I had to put all the #Html.Raw(...) stuff in there because it was having trouble finding the end tags for the foreach and if statements without them.
Anyway, here is my code. The line that is causing the exception is this:
#gameID = #pick.Game.GameID;
The exception is --> Compiler Error Message: CS1525: Invalid expression term '='
The intellisense shows #gameID as a variable and the #pick.Game.GameID seems to be correct as well.
<table>
<thead>
<tr>
<th>Game</th>
<th>Game Date/Time</th>
<th>Winner</th>
#foreach(var name in #Model.UserNames) {
<th>#name</th>
}
</tr>
</thead>
<tbody>
#{
int lastGameID = 0;
int gameID = 0;
bool firstGame = true;
}
#foreach(var pick in #Model.Picks) {
#gameID = #pick.Game.GameID;
if(#gameID != #lastGameID) {
if(!#firstGame){
<text>#Html.Raw("</tr>")</text>
}
#Html.Raw(
<tr>
<td>#pick.GameTeamDisplay</td>
<td>#pick.GameDateTimeDisplay</td>
<td>#pick.Game.WinningTeam.TeamAbbr</td>
<td>#pick.PickedTeamAbbr</td>
)
}
else {
#Html.Raw(<td>#pick.PickedTeamAbbr</td>)
}
}
#Html.Raw(</tr>)
</tbody>
</table>
UPDATE:
I've removed the #Html.Raw, , etc... Also wrapped the gameID assignment in a #{}. It's now giving me an error on this line,
#{gameID = #pick.Game.GameID;}
Compilation Error: CS1501: No overload for method 'Write' takes 0 arguments
Here is the updated Code:
#foreach(var pick in #Model.Picks) {
#{gameID = #pick.Game.GameID;}
if(#gameID != #lastGameID) {
if(!#firstGame){
#:</tr>
}
#:<tr>
<td>#pick.GameTeamDisplay</td>
<td>#pick.GameDateTimeDisplay</td>
<td>#pick.Game.WinningTeam.TeamAbbr</td>
<td>#pick.PickedTeamAbbr</td>
}
else {
<td>#pick.PickedTeamAbbr</td>
}
}
</tr>
You need to surround it with { } to make it a codeblock
#{gameID = pick.Game.GameID;}
Also, you don't need the # inside the foreach/if statements because they're code blocks.
e.g. you could just write:
foreach(var name in Model.UserNames) {
Just write
#foreach(var pick in Model.Picks) {
<tr>
<td>#pick.GameTeamDisplay</td>
<td>#pick.GameDateTimeDisplay</td>
<td>#pick.Game.WinningTeam.TeamAbbr</td>
<td>#pick.PickedTeamAbbr</td>
</tr>
}
You don't need # inside code block. You can use #: instead of <text>, Html.Raw
You can see here Razor syntax reference
I determined that my Razor view code was simply too complex. The real problem was that I was trying to force a view to work with a Model that I had created for another view. I ended up creating a few more models specifically for this view. Code is much cleaner and best of all it works! Here is the code I ended up with.
<table>
<thead>
<tr>
<th>Game</th>
<th>Game Date/Time</th>
<th>Winner</th>
#foreach(var name in #Model.UserNames) {
<th>#name</th>
}
</tr>
</thead>
<tbody>
#foreach(var game in #Model.Games) {
<tr>
<td>#game.GameDescription</td>
<td>#game.GameDisplayDateTime</td>
<td>#game.GameWinner</td>
#foreach(var pick in game.GamePicks){
<td>#pick.PlayerPick</td>
}
</tr>
}
</tbody>
</table>

Resources