I want to add one more field to my view. So basically, after displaying a town in the dropdown menu, I want to display the (*ABR) field as seen here.
As you can see from the picture, after Advance Ortopedical, I just want to add a filed called *ABR.
<table class="table datatable-responsive datatable-medical-map" id="medProviders" style="width:100%">
<thead>
<tr class="bg-info">
<th>Medical Provider (* Choose one)</th>
<th>Distance (miles)</th>
<th>Duration</th>
</tr>
</thead>
<tbody>
#{
int i = 0;
foreach (var item in medProviders)
{
<tr class="sortList" style="cursor:pointer" id="increment-#i" data-id="#item.Id" data-lat="#item.Latitude" data-long="#item.Longitude">
<td>#item.Firstname</td>
<td id="distance-#i"></td>
<td id="duration-#i"></td>
</tr>
i++;
}
}
</tbody>
</table>
<p id="medicalValidation"></p>
Any suggestions or comments on how to do this in a simple way?
Please use this code. This will add 1 more field at the end of table.
#{
int i = 0;
foreach (var item in medProviders)
{
<tr class="sortList" style="cursor:pointer" id="increment-#i" data-id="#item.Id" data-lat="#item.Latitude" data-long="#item.Longitude">
<td>
#item.Firstname
<br>*ABR</br>
</td>
<td id="distance-#i"></td>
<td id="duration-#i"></td>
</tr>
i++;
}
}
</tbody>
Related
I have created an e-commerce website and am using a label to display the products from my sql database, the image it shows of these products are not hyperlinks, but this is what I need them to be, I think I have written the right code but I have a "parentControl" error, could someone help plz?
Below is also a link to show you visually what is being asked. REMEMBER the picture is just an image, but needs to be a hyperlink!
private void FillPage()
{
ArrayList teesList = new ArrayList();
if (!IsPostBack)
{
teesList = ConnectionClass.GetTeesBySize("%");
}
else
{
teesList = ConnectionClass.GetTeesBySize(DropDownList1.SelectedValue);
}
StringBuilder sb = new StringBuilder();
HyperLink link = new HyperLink();
link.NavigateUrl = "http://google.com";
parentControl.Controls.Add(link);
foreach (Tees tees in teesList)
{
sb.Append(string.Format(#"<table class='TeesTable'>
<tr>
<th rowspan='1' width='150px'><img runat='server' src='{6}' /</th>
<th width='50px'>Name: </th>
<td>{0}</td>
</tr>
<tr>
<th>Size:</th>
<td>{1}</td>
</tr>
<tr>
<th>Price:</th>
<td>{2}</td>
</tr>
</table>",
tees.name, tees.size, tees.price, tees.id, tees.id, tees.id, tees.image));
LblOutput.Text = sb.ToString();
(https://dl-web.dropbox.com/get/CompetitiveStreakTemplate/Pic.png?_subject_uid=9403629&w=AAD63dzqPQcNMNSU0OwbVBrGjNGFvtt7VWJ6DKwlu4UoPw).
You need to close your <img> tag properly and wrap it in a <a> to make it a hyperlink. Also use <td> instead of <th> for data rows and not headers.
Something a bit more like:
<td rowspan='1' width='150px'>
<a href='{0}.aspx'>
<img runat='server' src='{6}' />
</a>
</td>
You should probably also tidy up the rest of the code appended to your table, checking what is a header or data, and using a <tbody> tag inside the <table>
Edit: looking closer it seems as though you aren't creating the table properly in the first place, change this chunk of your code to do the loop properly:
parentControl.Controls.Add(link);
sb.Append("<table class='TeesTable'><tbody>");
foreach (Tees tees in teesList)
{
sb.Append(string.Format(#"
<tr>
<td rowspan='1' width='150px'>
<a href='{0}.aspx'>
<img runat='server' src='{6}' />
</a>
</td>
<td width='50px'>Name: </td>
<td>{0}</td>
</tr>
<tr>
<td>Size:</td>
<td colspan='2'>{1}</td>
</tr>
<tr>
<td>Price:</td>
<td colspan='2'>{2}</td>
</tr>",
tees.name, tees.size, tees.price, tees.id, tees.id, tees.id, tees.image));
}
sb.Append("</tbody></table>");
LblOutput.Text = sb.ToString();
I have defined the following data model in dart file:
#observable List alist = toObservable([{'rel':'self', 'name':'John'},
{'rel':'Father', 'name':'tom'},
{'rel':'Mother', 'name':'jane'}]);
and table in html as follows:
<table id="summaryTable">
<thead>
<tr>
<th>Name</th>
<th>Ralationship to Me</th>
<th>Update History</th>
<th>Remove Relative</th>
</tr>
</thead>
<tr repeat = "{{p in alist}}">
<td>
{{p['name']}}
</td>
<td>
{{p['rel']}}
</td>
<td>
<button on-click="{{updateClicked}}">Update</button>
</td>
<td>
</td>
</tr>
</table>
The table is not getting populated. What should be changed?
It's hard to tell as you didn't provide much code but at least the template is missing in
<tr template repeat="{{p in alist}}">
I would like to take the model as in view?
#model Dictionary<string,List<string>>
<table width="60%">
<tr class="ui-widget-header">
<td>
___Category___
</td>
<td>
___Detail___
</td>
</tr>
<tr>
<td>
#Model.Key
</td>
<td>
#Model.Count
</td>
</tr>
</table>
How could I do this?
here is my view with razor syntax.
Please help me.
Yes you can do it. Below is the sample
#model Dictionary<string,List<string>>
#foreach (KeyValuePair<string, List<string>> pair in Model)
{
<label> #pair.Key</label>
<div>
#foreach(string data in #pair.Value)
{
<span>#data </span>
}
</div>
}
Add #model Dictionary<string,List<string>> to your view (assuming Razor is used).
#model Dictionary<string, List<string>>
#foreach (var group in Model)
{
<h2>#group.Key</h2>
<table>
<tr>
<th>Title</th>
</tr>
#foreach (var aString in group.Value){
<tr>
<td>#aString </td>
</tr>
}
</table>
}
I have a table than shown one record of my model. for example list of category.
i want to create manually row number for this table.
<table class="table table-striped table-bordered table-hover table-full-width dataTable">
#foreach (var item in Model)
{
<tr>
<td>
**I want to Show Row Number Here**
</td>
<td>
#Html.ActionLink(item.Name, "ViewSubCategory", "ProductSubCategory", new { id = item.Id }, null)
</td>
</tr>
}
</table>
Define a counter rowNo and write
#{ int rowNo = 0; }
#foreach (var item in Model) {
<tr style="background: #classtr;" >
<td>
#(rowNo += 1)
</td>
Define a counter rowNo and write
<table class="table table-striped table-bordered table-hover table-full-width dataTable">
#{int rowNo;}
#foreach (var item in Model)
{
<tr>
<td>
#rowNo++;
</td>
<td>
#Html.ActionLink(item.Name, "ViewSubCategory", "ProductSubCategory", new { id = item.Id }, null)
</td>
</tr>
}
</table>
None of the above worked for me - I did this:
#{int RowNo = 0;}
#foreach (var item in Model) {
<tr>
<td>#{RowNo++;} #RowNo</td>
You may use the Select overload:
<table class="table table-striped table-bordered table-hover table-full-width dataTable">
#foreach (var item in Model.Select((item,index)=>new{item,index})
{
<tr>
<td>
#item.index
</td>
<td>
#Html.ActionLink(item.item.Name, "ViewSubCategory", "ProductSubCategory", new { id = item.item.Id }, null)
</td>
</tr>
}
</table>
I've found the next option for my ASP.Net MVC project. All above options didn't work for my project.
#foreach (var item in Model.Select((x, i) => new { Data = x, Index = i + 1 }))
{
<tr>
<td>
#item.Index
</td>
<td>
#Html.DisplayFor(modelItem => item.Data.ReviewerName)
</td>
<td>
#Html.DisplayFor(modelItem => item.Data.ReviewerComments)
</td>
<td>
#Html.DisplayFor(modelItem => item.Data.ReviewerRating)
</td>
<td>
#Html.ActionLink("Edit", "Edit", new { id = item.Data.Id })
</td>
</tr>
}
I think this code will solve the problem
let rows = document.querySelectorAll('tr');
rows.forEach((row) => {
let z = document.createElement("td");
z.textContent = `(row #${row.rowIndex})`;
row.appendChild(z);
});
<table>
<thead>
<tr><th>Item</th> <th>Price</th></tr>
</thead>
<tbody>
<tr><td>Bananas</td> <td>$2</td></tr>
<tr><td>Oranges</td> <td>$8</td></tr>
<tr><td>Top Sirloin</td> <td>$20</td></tr>
</tbody>
<tfoot>
<tr><td>Total</td> <td>$30</td></tr>
</tfoot>
</table>
Easiest approach is to use CSS to have the row numbers in your tables in the index of you MVC View.
.css-serial {
counter-reset: serial-number;
/* Set the serial number counter to 0 */
}
.css-serial td:first-child:before {
counter-increment: serial-number+1;
/* Increment the serial number counter */
content: counter(serial-number);
/* Display the counter */
}
table{
font-family: Arial;
border:solid;
border-width:1px;
border-color:#dedede;
border-radius:5px;
}
th{
background-color:#efefef;
}
td{
padding:3px;
margin:3px;
}
<table class="css-serial">
<tr>
<th>Row #</th>
<! –– Row Number goes here automatically with CSS style ––>
<th>Name</th>
</tr>
<tr>
<td></td>
<td>John</td>
</tr>
<tr>
<td></td>
<td>Richard</td>
</tr>
<tr>
<td></td>
<td>Joe</td>
</tr>
<tr>
<td></td>
<td>Rogan</td>
</tr>
<tr>
<td></td>
<td>Lebron</td>
</tr>
<tr>
<td></td>
<td>Marcus</td>
</tr>
<tr>
<td></td>
<td>Jane</td>
</tr>
<tr>
<td></td>
<td>Maria</td>
</tr>
</table>
It does not seem to like #{index++;} , I have tried
#{int index++}, #(index++), #(int index++;)
This code didn't throw errors when used with MVC 2.
Here's it's giving me
ambiguity warnings about index.
#model CartTest.Models.Cart
#{
ViewBag.Title = "Index";
}
<h2>Cart Index</h2>
<table width="80%" align="center">
<thead><tr>
<th align="center">Quantity</th>
<th align="left">Item</th>
<th align="right">Price</th>
<th align="right">Subtotal</th>
</tr></thead>
<tbody>
#{int index = 0;}
#foreach (var line in Model.Lines)
{
<tr>
#Html.Hidden("Lines.Index", index);
<td align="center">#Html.TextBox("Lines[" + index + "].Quantity",line.Quantity)</td>
<td align="left">#line.Product.Name</td>
<td align="right">#line.Product.Price</td>
<td align="right">#(line.Quantity * line.Product.Price)</td>
<td align="right">#Html.ActionLink("Remove", "RemoveItem", new { productId = line.Product.ProductID }, null)</td>
</tr>
#{index++;}
}
</tbody>
<tfoot>
</tfoot>
</table>
Try like this:
#{int index = 0;}
#foreach (var line in Model.Lines)
{
<tr>
...
</tr>
index++;
}
Now that's just to make the Razor compiler happy. It's not a solution I recommend. The real solution I would recommend you is to use editor templates:
<table width="80%" align="center">
<thead>
<tr>
<th align="center">Quantity</th>
<th align="left">Item</th>
<th align="right">Price</th>
<th align="right">Subtotal</th>
</tr>
</thead>
<tbody>
#Html.EditorFor(x => x.Lines)
</tbody>
<tfoot>
</tfoot>
</table>
and inside the corresponding editor template of a Line (~/Views/Shared/EditorTemplates/LineViewModel.cshtml) which will be rendered for each element of the Line collection:
#model LineViewModel
<td align="center">
#Html.TextBoxFor(x => x.Quantity)
</td>
<td align="left">
#Html.DisplayFor(x => x.Product.Name)
</td>
<td align="right">
#Html.DisplayFor(x => x.Product.Price)
</td>
<td align="right">
#Html.DisplayFor(x => x.CalculatedTotalPrice)
</td>
<td align="right">
#Html.ActionLink("Remove", "RemoveItem", new { productId = Model.Product.ProductID }, null)
</td>
See, no more ugly loops, weakly typed helpers, dealing with some indexes, etc... Everything works by conventions.