Mark item when it's selected - c#

I am starting to learn asp.net and I am a totally noob.
So, I am trying to select a town and, in the right side I should get the list of all town (like in the picture above).
So I am trying to do like, when I select a town from left side it should be mark as selected as from the right side.
My code is below
<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>

Related

Razor table loading extremely slow

I am populating a razor table with a decent amount of data, but it takes > 10 minutes to load.
I am using a lot of logic in my view, and i know this isnt the best way to do this but this is what ive come up, as im new to razor.
names contains about 800 items, contacts 700, urls 3600, servers 1200
I dont think this is a lot but the way i am making the table is what i assume is holding up the application since i traverse these lists multiple times while within other ones.
Ive applied DataTables to this table, i thought it would help as limiting the rows show on the screen should mean the entire lists arent being traversed? Unless datatables still loads the entire table and just displays the 25. Is there a way to only load 100 results initially then slowly load the rest in over time?
Whats the best way to stop my app from hanging when creating this table
<table class="table table-responsive" id="result" data-page-length='25'>
<thead>
<tr>
<th>Application</th>
<th>Ministry</th>
<th>Contacts</th>
<th>Server</th>
<th>URL</th>
</tr>
</thead>
<tbody>
#foreach(var l in Model.names)
{
<tr>
<td style="width: 27%">
#Html.DisplayFor(modelItem => l.appName)
</td>
<td style="width:20%">
#Html.DisplayFor(modelItem => l.ministry)
</td>
<td style="width:20%">
#foreach (var k in Model.contacts)
{
if(k.appName == l.appName){#Html.Raw(k.contactName + " - " + k.contactRole + "<br>")}
}
</td>
<td colspan="2">
<table>
#foreach(var s in Model.servers)
{
<tr >
#if(s.appName == l.appName)
{
<td>
<p class="big">
#Html.Raw(s.server)
</p>
</td>
}
<td>
#foreach(var u in Model.filteredURls)
{
#if(u.appName == l.appName && u.server == s.server){#Html.Raw(u.url + "<br>")}
}
</td>
</tr>
}
</table>
</td>
</tr>
}
</tbody>
</table>
</div>
<script type="text/javascript" >
jQuery(document).ready(function () {
jQuery('#result').DataTable();
});
</script>

ASP.Net Get HTML cell value for code behind by clicking

I'm not a professional in C# and ASP.Net so please have some patience with me.
I have the following problem.
I'm using ASP.Net WebForm API with C# for creating a dashboard.
I have a generic HTML table (taken out from a sql query) which will be displayed. Now I want to implement the feature, that when the user clicks on a cell for example in the column ID, he should get an details view which is a bootstrap modal.
For that I need the ID value which is in this cell. How can I get this value?
With the value I will start a new sql query and more other specific informations are going to be shown.
Here is my aspx. structure:
<table id="MyTable" class="table table-striped table-bordered table-condensed table-responsive">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Typ</th>
<th>Something else</th>
<th>Date</th>
</tr>
</thead>
<tbody>
<%=Tabelle.GetTable.dataTable_all%>
</tbody>
</table>
<script type="text/javascript">
$(document).ready(function () {
$('#MyTable').DataTable();
});
</script>
the variable dataTable_all is a string. So this is my table in HTML Code.
My Result for <tbody> is 366 rows big and here is an extract:
<tr>
<td>154789</td>
<td>Testproject X</td>
<td>Good</td>
<td>greencolored</td>
<td>01.01.2015</td>
</tr>
<tr>
<td>189365</td>
<td>Testproject B</td>
<td>Good</td>
<td>redcolored</td>
<td>08.01.2015</td>
</tr>
<tr>
<td>136471</td>
<td>Testproject Y</td>
<td>Bad</td>
<td>pinkcolored</td>
<td>15.04.2015</td>
</tr>
So how can I do it that when I click on for example ID 136471 that the value will be given to a variable in my c# code?
Change to:
<tr data-id="154789">
<td>154789</td>
<td>Testproject X</td>
<td>Good</td>
<td>greencolored</td>
<td>01.01.2015</td>
</tr>
<tr data-id="189365">
<td>189365</td>
<td>Testproject B</td>
<td>Good</td>
<td>redcolored</td>
<td>08.01.2015</td>
</tr>
<tr data-id="136471">
<td>136471</td>
<td>Testproject Y</td>
<td>Bad</td>
<td>pinkcolored</td>
<td>15.04.2015</td>
</tr>
Then use:
$('tbody tr').click(function() {
alert($(this).data('id'));
});
Working demo
https://jsfiddle.net/jknysneo/

ASP.NET counter in loop [duplicate]

This question already has answers here:
Simple increment of a local variable in views in ASP.NET MVC3 (Razor)
(5 answers)
Closed 7 years ago.
I have a foreach loop in my ASP.NET code and I am trying to add a counter by adding #counter++ at the end of the loop, but it's not working, I get an invalid expression term error. I have also tried #{ counter++ } but that didn't work either.
<table border="1" style="width:762px;height:25px; border-style:1px solid #000; border-collapse:collapse; clear:both;">
#{
int counter = 1;
}
#foreach (var person in #ViewBag.POLoopList)
{
<tr>
<td style="width:24px; text-align:right;">#counter</td>
<td style="width:55px">#person.EstPhase</td>
<td style="width:32px">#person.JCCategory</td>
<td style="width:180px">#person.ItemsDesc</td>
<td style="width:90px; text-align:left;">#person.Comments</td>
<td style="width:57px; text-align:right;">#person.OrderQty</td>
<td style="width:40px; text-align:center;">#person.OrderUOM</td>
<td style="width:56px; text-align:right;">#Convert.ToDouble(person.Rate).ToString("N")</td>
<td style="width:70px; text-align:right;">$#Convert.ToDouble(person.Pretax).ToString("N")</td>
</tr>
#counter++
}
</table>
Remove the # from #counter++:
<table border="1" style="width:762px;height:25px; border-style:1px solid #000; border-collapse:collapse; clear:both;">
#{
int counter = 1;
}
#foreach (var person in #ViewBag.POLoopList)
{
<tr>
<td style="width:24px; text-align:right;">#counter</td>
<td style="width:55px">#person.EstPhase</td>
<td style="width:32px">#person.JCCategory</td>
<td style="width:180px">#person.ItemsDesc</td>
<td style="width:90px; text-align:left;">#person.Comments</td>
<td style="width:57px; text-align:right;">#person.OrderQty</td>
<td style="width:40px; text-align:center;">#person.OrderUOM</td>
<td style="width:56px; text-align:right;">#Convert.ToDouble(person.Rate).ToString("N")</td>
<td style="width:70px; text-align:right;">$#Convert.ToDouble(person.Pretax).ToString("N")</td>
</tr>
counter++
}
</table>
When inside of a foreach and you have not placed the variable within an html element, you do not need the # symbol.
change:
#counter++
to
counter++
Additionally, here is a nice quick guide on Razor Syntax

Passing a list from Controller to View in ASP.NET MVC 4

I have an Index action method as follows.I am passing a list of Providers to the View.
public ActionResult Index()
{
Provider providerList = new Provider();
List<Provider> providers = DAL.GetListofProviders.ToList();
return View(providers);
}
In the View,I have the following code to receive the List of Providers.
#model IEnumerable<DEMO_JAN14.Models.Provider>
#{
Layout = "~/Views/Shared/_Layout.cshtml";
}
<head>
<title>LIST OF PROVIDERS</title>
</head>
<body>
<table class="table table-striped table-bordered table-hover">
<tr>
<th>Provider Type</th>
<th>First Name</th>
<th>Last Name</th>
<th>Certification</th>
<th>Specialization</th>
<th>SSN</th>
<th>Facility Name</th>
<th>Contact No</th>
<th>Contact Email</th>
<th></th>
</tr>
<tbody data-bind="foreach: viewmodel">
<tr>
<td class="col-lg-2" data-bind="text: ProviderType"></td>
<td class="col-lg-1" data-bind="text: FirstName"></td>
<td class="col-lg-1" data-bind="text: LastName"></td>
<td class="col-lg-1" data-bind="text: Certification"></>
<td class="col-lg-1" data-bind="text: Specialization"></td>
<td class="col-lg-1" data-bind="text: SSN"></td>
<td class="col-lg-4" data-bind="text: FacilityName"></td>
<td class="col-lg-4" data-bind="text: ContactNumber"></td>
<td class="col-lg-1" data-bind="text: ContactEmail"></td>
<td><a class="btn btn-danger" id="del" onclick = "return confirm('Are you sure, you want to delete');" data-bind="attr: { href: '/Provider/Delete/' + ProviderID }"> Delete </a>
</td>
</tr>
</tbody>
I see the list of Providers in the controller
But I dont see the same list in the view as shown
Am I doing something wrong.Please guide me in the right directions.Thanks.
You can iterate like this (using your code)
#model IEnumerable<DEMO_JAN14.Models.Provider>
#{
Layout = "~/Views/Shared/_Layout.cshtml";
}
<head>
<title>LIST OF PROVIDERS</title>
</head>
<body>
<table class="table table-striped table-bordered table-hover">
<tr>
<th>#Html.DisplayNameFor(m => m.ProviderType)</th>
<th>#Html.DisplayNameFor(m => m.FirstName)</th>
...
</tr>
#foreach (var item in Model)
<tr>
<td class="col-lg-2">#Html.DisplayFor(modelItem => item.ProviderType)</td>
<td class="col-lg-1">#Html.DisplayFor(modelItem => item.FirstName)</td>
...
</tr>
</table>
</body>
To check the count of the providers list inside the view use the following property #Model
In your view you can iterate like this on the items, and for example am displaying FirstName of each Provider in the List:
#foreach(var item in Model)
{
<h1>#item.FirstName </h1>
}
Using your html:
<tbody data-bind="foreach: viewmodel">
#foreach(var item in Model)
{
<tr>
<td class="col-lg-2">#item.ProviderType</td>
<td class="col-lg-1">#item.FirstName</td>
........................................
........................................
// and so on other properties
<td><a class="btn btn-danger" id="del" onclick = "return confirm('Are you sure, you want to delete');" href="#Url.Action("Delete","Provider")+ item.ProviderID }"> Delete </a>
</td>
</tr>
you can't access the razor Model object via knockout
you need to receive your data as json result
please refer to this article
http://www.codeproject.com/Articles/424642/Customer-KnockoutJS-and-MVC-demo-using-JSON

Razor get value of input HTML bounded by foreach

I have one following table html, the data of rows in the table is looped by foreach.
Can I use Razor to get the value of each row into a List or an array in C#?
My C# code Razor (I tried this so far)
#{
var l = new List<string>();
l.Add(#<input id="updated_value2" data-bind="value:value,visible:isEditing()" />);
}
Here's my table
<table class="table table-hover">
<tbody data-bind="foreach: $root.mapJsons(parameters())">
<tr class="data-hover">
<td>
<strong>
<span data-bind="text:key" />
</strong>
</td>
<td>
#*display label and input for dictionary<value> false DIS true APP*#
<input id="updated_value" data-bind="value:value,visible:isEditing()" />
<label id="display_value" data-bind="text:value,visible:!isEditing()" />
</td>
</tr>
</tbody>
<thead>
<tr>
<th style="width: 30%">
Name
</th>
<th style="width: 30%">
Value
</th>
<th></th>
</tr>
</thead>
</table>
Your foreach loop is being executed client-side (looks like a KnockoutJS binding?) rather than server-side, so any Razor code you embed in the table is only going to be called once as it's rendered by the server. So the answer is no, you cannot populate a server-side list with this particular foreach loop.

Categories