Develop Reference

How to get all value of all checked rows in table with FormCollection?

I have searched for help but can find any topic that could help me.
I have a table like this
<table id="tableftest" class="table table-striped table-vmiddle">
<thead>
<tr>
<th data-column-id="" data-sortable="false">
<input type="checkbox" id="checkall" title="chọn tất cả" onclick="" />
</th>
<th data-column-id="ip">IP</th>
<th data-column-id="network" hidden="hidden">Network</th>
<th data-column-id="sender">GateWay</th>
<th data-column-id="received">SubnetMask</th>
<th data-column-id="viewdetail">VPS được gán</th>
#*<th data-column-id="commands" data-formatter="commands" data-sortable="false"></th>*#
</tr>
</thead>
<tbody>
#foreach (VPSIP ipitem in ip)
{
<tr>
#if (ipitem.VPSID != null)
{
<td></td>
}
else
{
<td>
<input type="checkbox" class="ipDelListClass" name="ipDelList" value="#ipitem.IpID" />
</td>
}
<td>#(ipitem.IPAddress)</td>
<td hidden="hidden">#ipitem.NetworkRanx.NetworkAddress</td>
<td>#(ipitem.NetworkRanx.Gateway)</td>
<td>#ipitem.NetworkRanx.SubnetMask</td>
#if (ipitem.VPSID != null)
{
<td>#(ipitem.VPSs.VPSName)</td>
#*<td></td>*#
}
else
{
<td></td>
#*<td>
<button title="Xóa ip" class="btn btn-danger zmdi zmdi-delete" data-toggle="modal" data-target="#IpDel_#ipitem.IpID" style="font-size:medium"></button>
</td>*#
}
</tr>
}
</tbody>
</table>
When I check all checkboxs in table and click button delete, it will post data to this controller
[HttpPost]
public ActionResult IPDeleteMany(FormCollection f)
{
var ipDelArray = f.Get("ipDelList");
ServerBusiness serBu = new ServerBusiness();
string[] ipDelList = ipDelArray.Split(',');
try
{
foreach (string ipId in ipDelList)
{
var iprow = serBu.getIPById(int.Parse(ipId));
serBu.removeIPById(iprow);
}
TempData["Success"] = "IP đã bị xóa!";
return RedirectToAction("ViewListIP", "TechnicalStaff");
}
catch
{
TempData["Error"] = "Lỗi!";
return RedirectToAction("ViewListIP", "TechnicalStaff");
}
}
When it runs, it only get values of rows that is visible, not all the rows in table.
Is there anyway to get all of values checked in table include invisible rows?

change your hidden="hidden" to style="display:none;".
And for you other pages, because you didnt use Ajax your data isn't exist in fact, so you can:
use Ajax and hide your old rows and append new rows where exist
all of your desired rows in your html however some of them be
hidden.
force your users to submit current page data and then switch pages.

JQuery: Losing Styles after ajax query succes where I am adding data

I have a table which via ajax I get n rows, after success I add to the tbodyo the table. I dont know why I am losing styles
My table is:
<table id="Pedidos">
<thead>
<tr>
<th>field 1</th>
<th>field 1</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
After to add data In Jquery I have
...
function onSuccessOrder(data) {
jQuery("#Pedidos tbody").empty().append(data);
}
...
PageMethods.OrdenarTabla(1, "DESC", onSuccessOrder);
In OrdenarTabla I set data i need:
...
string row = #"
<tr>
<td class=""check"">{0}</td>
<td>{1}</td>
</tr>";
return row;
...
Why Am I losing the styles? what is wrong?

I got the solution:
jQuery("#Pedidos tbody").empty().append(data);
jQuery("#tbPedidos tbody").find('input:checkbox').uniform({ selectAutoWidth: true });

C# modifying strings

I'm working on an application in which I retrieve data from a database to be displayed in a table in my cshtml. One of the fields I'm calling is a date field. The data for it in the database is stored in the following format: MMDDYY i.e; 091504. For reasons I need not get into, the data has to be stored in that format in the database. I'm trying to figure out how I can modify its display to show 09/15/04 instead of 091504.
#model IEnumerable<BillingApp.Models.SERV_CHARGE_INT_RATE_NSF_PENALTY>
<table id="Test" class="tablesorter">
<thead>
<tr>
<th>Effective Date</th>
</tr>
</thead>
#if (Model.Count() == 0)
{
<tbody>
<tr>
<td colspan="4">
No Records match search criteria
</td>
</tr>
</tbody>
}
else{
<tbody>
#foreach (var item in Model)
{
<tr>
<td>
#Html.DisplayFor(modelItem => item.EFFECTIVE_DATE)
</td>
</tr>
}
</tbody>
</table>

If you use a DateTime object, you can try using [DisplayFormat] in your model.
Ex :
[DisplayFormat(DataFormatString = "{MM/dd/yy}")]
public DateTime EFFECTIVE_DATE { get; set }
If you are using a string instead of DateTime, you could consider converting the data type by using #ByteBlast's solution :
DateTime.ParseExact(item.EFFECTIVE_DATE, "MMddyy", CultureInfo.CurrentCulture);

There are many ways to handle this.
One would be to have your model class parse the dates coming out of the database into actual DateTime objects and then use those throughout your application (probably the best choice, if you need to do anything else with the dates).
Another would be to slice up the string when displaying it, if all you need to do is display the date. Something along the lines of this:
#foreach (var item in Model)
{
<tr>
<td>
#(item.EFFECTIVE_DATE.Substring(0,2))/#(item.EFFECTIVE_DATE.Substring(2,2))/#(item.EFFECTIVE_DATE.Substring(4,2))
</td>
</tr>
}

Multiplying a textbox with a cell in a dynamically created table with JQuery

I have a dynamically created table with id called "editTable" that looks as follows:
<tbody>
#{var i = 0;}
#foreach (var item in Model)
{
<tr>
<td width="25%">
#Html.DisplayFor(modelItem => item.Product.Name)
</td>
<td width="25%">
#Html.DisplayFor(modelItem => item.Quantity)
</td>
<td width="25%">
<div class="editor-field">
#Html.EditorFor(modelItem => item.UnitPrice)
#Html.ValidationMessageFor(model => item.UnitPrice)
</div>
</td>
<td width="25%" id="total"></td>
</td>
</tr>
}
</tbody>
The 3th td-element consists of a C# textbox that is turned into a element in html.
Now I want to multiply the quantity by the unit price to display this value in the 4th td element next to it. This value should update every time the value in the textbox is adjusted. I am a newbie at JQuery / JavaScript and came up with the following code:
// Calculating quantity*unitprice
$('#editTable tr td:nth-child(3) input').each( function (event) {
var $quant = $('#editTable tr td:nth-child(2)', this).val();
var $unitPrice = $('#editTable tr td:nth-child(3) input', this).val();
$('#editTable tr td:nth-child(4)').text($quant * $unitPrice);
});
This doesn't work and only displays NaN in the 4th element. Can anyone help me updating this code to a working version? Any help would be very much appreciated.

I geussed you accidentally switched units and price because it has more logic to change the number of units then the price. I took your html and javascript and tried to change as little as possible to make it work (I'm not saying the solution is perfect, I just don't want to give you a totaly different example of how to do it).
The html (The C# is irrelevant for this problem):
<table id="editTable">
<tbody>
<tr>
<td width="25%">
Product name
</td>
<td width="25%">
5
</td>
<td width="25%">
<div class="editor-field">
<input id="UnitPrice" name="UnitPrice" type="number" value="2" style="width:40px" />
</div>
</td>
<td width="25%" id="total"></td>
</tr>
</tbody>
</table>
The javascript/jquery (which should run on load):
$('#editTable tr td:nth-child(3) input').each(updateTotal);
$('#editTable tr td:nth-child(3) input').change(updateTotal);
var element;
function updateTotal(element)
{
var quantity = $(this).closest('tr').find('td:nth-child(2)').text();
var price = $(this).closest('tr').find('td:nth-child(3) input').val();
$(this).closest('tr').find('td:nth-child(4)').text(quantity * price);
}
The problem you had were with jquery. I've created a function that recieves an element (in our case it's your UnitPrice input), then it grabs the closest ancestor of type tr (the row it's in) and from there it does what you've tried to do.
You've used jquery selector to get all 2nd cells in all table rows, the closest('tr').find limits it to the current row.
You've tried to use .val() on a td element, you should use either .text() or .html(). Instead, You can also add a data-val="<%=value%>" on the td and then use .data('val').
It will be better to take the units directly from $(element).val() and no going to the tr and then back into the td and the input.
To see it working: http://jsfiddle.net/Ynsgf/1/
I hope I didn't caused you any confusion with my explanation and the options I gave you.

Here is another way to write the jquery part.
$('#editTable tr').each(function (i, row) {
var $quant = $(row).find('.editor-field input').val();
var $unitPrice = $(row).find('.editor-field input').val();
$(row).find('td:nth-child(4)').text($quant * $unitPrice);
});

Parse data/numbers from table cells C# or VisualBasic

I have a string which contains html code from a webpage. There's a table in the code I'm interested in. I want to parse the numbers present in the table cells and put them in textboxes, each number in its own textbox. Here's the table:
<table class="tblSkills">
<tr>
<th class="th_first">Strength</th><td class="align_center">15</td>
<th>Passing</th><td class="align_center">17</td>
</tr>
<tr>
<th class="th_first">Stamina</th><td class="align_center">16</td>
<th>Crossing</th><td class="align_center"><img src='/pics/star.png' alt='20' title='20' /></td>
</tr>
<tr>
<th class="th_first">Pace</th><td class="align_center"><img src='/pics/star_silver.png' alt='19' title='19' /></td>
<th>Technique</th><td class="align_center">16</td>
</tr>
<tr>
<th class="th_first">Marking</th><td class="align_center">15</td>
<th>Heading</th><td class="align_center">10</td>
</tr>
<tr>
<th class="th_first">Tackling</th><td class="align_center"><span class='subtle'>5</span></td>
<th>Finishing</th><td class="align_center">15</td>
</tr>
<tr>
<th class="th_first">Workrate</th><td class="align_center">16</td>
<th>Longshots</th><td class="align_center">8</td>
</tr>
<tr>
<th class="th_first">Positioning</th><td class="align_center">18</td>
<th>Set Pieces</th><td class="align_center"><span class='subtle'>2</span></td>
</tr>
</table>
As you can see there are 14 numbers. To make things worse numbers like 19 and 20 are replaced by images and numbers lower than 6 have a span class.
I know I could use HTML agility pack or something similar, but I'm not yet that good to figure how to do it by myself, so I need your help.

Your HTML sample also happens to be good XML. You could use any of .net's XML reading/parsing techniques.

Using LINQ to XML in C#:
var doc = XDocument.Parse(yourHtml);
var properties = new List<string>(
from th in doc.Descendants("th")
select th.Value);
var values = new List<int>(
from td in doc.Descendants("td")
let img = td.Element("img")
let textValue = img == null ? td.Value : img.Attribute("alt").Value
select int.Parse(textValue));
var dict = new Dictionary<string, int>();
for (var i = 0; i < properties.Count; i++)
{
dict[properties[i]] = values[i];
}