![enter image description here][1]In my application, I have used the MVC telerik grid, bounded with input textboxes. While I run the application in Internet Explorer and the Chrome browser, the tab indexing in working fine and control is moving from one textbox to the other. But when using the Firefox browser, the tab indexing is moving from table row to table row and highlighting the complete cell.
Please help me to fix this.
<div class="appln-cnt-c2">
<div class="frm-fldrow">
<div class="appln-txtrow" style="width: 800px; position: relative; left: 45px;">
#{
Html.Telerik().Grid(Model.FacultyCompositions)
.Name("FacultyComositionGrid")
.DataKeys(keys => keys.Add(m => m.FacultyCompositionPK))
.ClientEvents(events => events.OnComplete("FacultyComositionGrid_onComplete").OnError("FacultyComositionGrid_onError").OnDelete("OnDelete").OnEdit("OnEdit"))
.Columns(columns =>
{
columns.Bound(m => m.EthnicityDescription)
.Title("<strong>Ethnicity</strong>").Width(180).Filterable(false).Sortable(false).ReadOnly(true);
columns.Template(#<text>
<table cellspacing="0" cellpadding="0">
<tr id="data">
<td>
<input type="text" class="FacultyCompositionTextbox" value="#item.FCYear1Male" #(Model.ReadOnlyFacultyCompositionNew[0])#(item.DisableCalculatedRow) maxlength="4" onkeypress="return IsNumeric(event);" />
</td>
<td>
<input class="FacultyCompositionTextbox" type="text" value="#item.FCYear1Female" #(Model.ReadOnlyFacultyCompositionNew[0]) #(item.DisableCalculatedRow) maxlength="4" onkeypress="return IsNumeric(event);" />
<input class="FacultyCompositionTextbox" type="hidden" value="#item.EthnicityPK" />
</td>
</tr>
</table>
</text>)
.HeaderTemplate(
#<text>
<table cellspacing="0" cellpadding="0">
#if (Model.FacultyCompositionColumnHeader[0] != "")
{
<tr>
<td colspan="2"><strong>#Model.FacultyCompositionColumnHeader[0]</strong></td>
</tr>
<tr>
<td><span>M</span></td>
<td><span>F</span></td>
</tr>
}
else
{
<tr>
<td colspan="2"><strong></strong></td>
</tr>
<tr>
<td><span></span></td>
<td><span></span></td>
</tr>
}
</table>
</text>).Width(20);
columns.Template(#<text>
<table cellspacing="0" cellpadding="0">
<tr id="data">
<td>
<input type="text" class="FacultyCompositionTextbox" value="#item.FCYear2Male" #(Model.ReadOnlyFacultyCompositionNew[1]) #(item.DisableCalculatedRow) maxlength="4" onkeypress="return IsNumeric(event);" />
</td>
<td>
<div style="position: relative;">
<input class="FacultyCompositionTextbox" type="text" value="#item.FCYear2Female" #(Model.ReadOnlyFacultyCompositionNew[1]) #(item.DisableCalculatedRow) maxlength="4" onkeypress="return IsNumeric(event);" />
<input class="FacultyCompositionTextbox" type="hidden" value="#item.EthnicityPK" />
</div>
</td>
</tr>
</table>
</text>)
.HeaderTemplate(
#<text>
<table cellspacing="0" cellpadding="0">
#if (Model.FacultyCompositionColumnHeader[1] != "")
{
<tr>
<td colspan="2"><strong>#Model.FacultyCompositionColumnHeader[1]</strong></td>
</tr>
<tr>
<td><span>M</span></td>
<td><span>F</span></td>
</tr>
}
else
{
<tr>
<td colspan="2"><strong></strong></td>
</tr>
<tr>
<td><span></span></td>
<td><span></span></td>
</tr>
}
</table>
</text>).Width(20);
columns.Template(#<text>
<table cellspacing="0" cellpadding="0">
<tr id="data">
<td>
<input type="text" class="FacultyCompositionTextbox" value="#item.FCYear3Male" #(Model.ReadOnlyFacultyCompositionNew[2]) #(item.DisableCalculatedRow) maxlength="4" onkeypress="return IsNumeric(event);" />
</td>
<td>
<input class="FacultyCompositionTextbox" type="text" value="#item.FCYear3Female" #(Model.ReadOnlyFacultyCompositionNew[2]) #(item.DisableCalculatedRow) maxlength="4" onkeypress="return IsNumeric(event);" />
<input class="FacultyCompositionTextbox" type="hidden" value="#item.EthnicityPK" /></td>
</tr>
</table>
</text>)
.HeaderTemplate(
#<text>
<table cellspacing="0" cellpadding="0">
#if (Model.FacultyCompositionColumnHeader[2] != "")
{
<tr>
<td colspan="2"><strong>#Model.FacultyCompositionColumnHeader[2]</strong></td>
</tr>
<tr>
<td><span>M</span></td>
<td><span>F</span></td>
</tr>
}
else
{
<tr>
<td colspan="2"><strong></strong></td>
</tr>
<tr>
<td><span></span></td>
<td><span></span></td>
</tr>
}
</table>
</text>).Width(20);
columns.Template(#<text>
<table cellspacing="0" cellpadding="0">
<tr id="data">
<td>
<input type="text" class="FacultyCompositionTextbox" value="#item.FCYear4Male" #(Model.ReadOnlyFacultyCompositionNew[3]) #(item.DisableCalculatedRow) maxlength="4" onkeypress="return IsNumeric(event);" /></td>
<td>
<input class="FacultyCompositionTextbox" type="text" value="#item.FCYear4Female" #(Model.ReadOnlyFacultyCompositionNew[3]) #(item.DisableCalculatedRow) maxlength="4" onkeypress="return IsNumeric(event);" />
<input class="FacultyCompositionTextbox" type="hidden" value="#item.EthnicityPK" /></td>
</tr>
</table>
</text>)
.HeaderTemplate(
#<text>
<table cellspacing="0" cellpadding="0">
#if (Model.FacultyCompositionColumnHeader[3] != "")
{
<tr>
<td colspan="2"><strong>#Model.FacultyCompositionColumnHeader[3]</strong></td>
</tr>
<tr>
<td><span>M</span></td>
<td><span>F</span></td>
</tr>
}
else
{
<tr>
<td colspan="2"><strong></strong></td>
</tr>
<tr>
<td><span></span></td>
<td><span></span></td>
</tr>
}
</table>
</text>).Width(60);
})
.DataBinding(dataBinding => dataBinding.Ajax())
.ABAGridConfiguration(true)
.KeyboardNavigation(kbd => kbd.EditOnTab(false))
.Render();
}
</div>
</div>
</div>
Finally found the solution :)
Steps Invloved :
1. To find the associated key value with TAB key
2. Once Keydown event fires focus moves to next control
$('input.FacultyCompositionTextbox').keydown(function(event) {
if(event.which == 9) {
//alert('a');
$(this).next('input.FacultyCompositionTextbox').focus();
}
});
Regards,
Praveen Nelge
Related
I need to convert a Html Table to DataTable in C#. I used HtmlAgilityPack but it does not convert it well because of rowspans.
The code I am currently using is:
private static DataTable convertHtmlTableToDataTable()
{
WebClient webClient = new WebClient();
string urlContent = webClient.DownloadString("http://example.com");
string tableCode = getTableCode(urlContent);
string htmlCode = tableCode.Replace(" ", " ");
HtmlDocument doc = new HtmlDocument();
doc.LoadHtml(htmlCode);
var headers = doc.DocumentNode.SelectNodes("//tr/th");
DataTable table = new DataTable();
foreach (HtmlNode header in headers)
{
table.Columns.Add(header.InnerText);
}
foreach (var row in doc.DocumentNode.SelectNodes("//tr[td]"))
{
table.Rows.Add(row.SelectNodes("td").Select(td => td.InnerText).ToArray());
}
return table;
}
And this is a part of Html Table:
<table class="tabel" cellspacing="0" border="0">
<caption style="font-family:Verdana; font-size:20px;">SEMGRP</caption>
<tr>
<th class="celula" >Ora</th>
<th class="latime_celula celula">Luni</th>
<th class="latime_celula celula">Marti</th>
<th class="latime_celula celula">Miercuri</th>
<th class="latime_celula celula">Joi</th>
<th class="latime_celula celula">Vineri</th>
</tr>
<tr>
<td class="celula" nowrap="nowrap">8-9</td>
<td class="celula" rowspan="2">
<table border="0" align="center">
<tr>
<td nowrap="nowrap" align="center">
Curs
<br />
<a class="link_celula" href="afis_n0.php?id_tip=287&tip=p">Prof</a>
<br />
<a class="link_celula" href="afis_n0.php?id_tip=9&tip=s">Sala</a>
<br />
</td>
</tr>
</table>
</td>
<td class="celula" rowspan="2">
<table border="0" align="center">
<tr>
<td nowrap="nowrap" align="center">
Curs
<br />
<a class="link_celula" href="afis_n0.php?id_tip=287&tip=p">Prof</a>
<br />
<a class="link_celula" href="afis_n0.php?id_tip=12&tip=s">Sala</a>
<br />
</td>
</tr>
</table>
</td>
<td class="celula"> </td>
<td class="celula"> </td>
<td class="celula" rowspan="2">
<table border="0" align="center">
<tr>
<td nowrap="nowrap" align="center">
Curs
<br />
<a class="link_celula" href="afis_n0.php?id_tip=293&tip=p">Prof</a>
<br />
<a class="link_celula" href="afis_n0.php?id_tip=9&tip=s">Sala</a>
<br />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td class="celula" nowrap="nowrap">9-10</td>
<td class="celula"> </td>
<td class="celula"> </td>
</tr>
<tr>
<td class="celula" nowrap="nowrap">10-11</td>
<td class="celula" rowspan="2">
<table border="0" align="center">
<tr>
<td nowrap="nowrap" align="center"> Curs
<br /><a class="link_celula" href="afis_n0.php?id_tip=303&tip=p">Prof</a>
<br /><a class="link_celula" href="afis_n0.php?id_tip=9&tip=s">Sala</a>
<br />
</td>
</tr>
</table>
</td>
<td class="celula" rowspan="2">
<table border="0" align="center">
<tr>
<td nowrap="nowrap" align="center"> Curs
<br />
<a class="link_celula" href="afis_n0.php?id_tip=331&tip=p">Prof</a>
<br />
<a class="link_celula" href="afis_n0.php?id_tip=14&tip=s">Sala</a>
<br />
</td>
</tr>
</table>
</td>
<td class="celula" rowspan="2">
<table border="0" align="center">
<tr>
<td nowrap="nowrap" align="center"> Curs
<br /><a class="link_celula" href="afis_n0.php?id_tip=330&tip=p">Prof</a>
<br /><a class="link_celula" href="afis_n0.php?id_tip=9&tip=s">Sala</a>
<br />
</td>
</tr>
</table>
</td>
<td class="celula"> </td>
<td class="celula" rowspan="2">
<table border="0" align="center">
<tr>
<td nowrap="nowrap" align="center"> Curs
<br />
<a class="link_celula" href="afis_n0.php?id_tip=293&tip=p">Prof</a>
<br />
<a class="link_celula" href="afis_n0.php?id_tip=10&tip=s">Sala</a> <br />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td class="celula" nowrap="nowrap">11-12</td>
<td class="celula"> </td>
</tr>
<tr>
I tried some solutions but I did not find any good...
Thanks for any help in advance.
I am facing an error in generating a proper PDF Document. the code i have, can generate a pdf document, it can download the document, but the issue is i cannot view the view the document. This is the Page I am trying to export to pdf.
Here is my code so far:
ASPX:
<asp:Button ID="btnDownload" CssClass="btn" runat="server" Text="Download Invoice" OnClick="btnDownload_Click" />
<asp:Panel ID="pnl" runat="server">
<div id="page-wrap">
<textarea id="header" style="height: 30px">PAYMENT DETAILS</textarea>
<div id="identity">
<textarea style="background-color: #F7F7F7;" readonly="readonly" id="address">My Name
My Street Address
Phone: 111-111-111</textarea>
<div id="logo">
<div id="logoctr">
</div>
<div id="logohelp">
<input id="imageloc" readonly="readonly" type="text" size="50" value="" /><br />
(max width: 540px, max height: 100px)
</div>
<img id="image" src="images/logo.png" alt="logo" />
</div>
</div>
<div style="clear: both"></div>
<div id="customer">
<textarea id="tbCustomer" readonly="readonly" runat="server"></textarea>
<table id="meta">
<tr>
<td class="meta-head">Payment ID</td>
<td>
<textarea readonly="readonly" runat="server" id="tbPID"></textarea></td>
</tr>
<tr>
<td class="meta-head">Date</td>
<td>
<textarea id="date" readonly="readonly" runat="server"></textarea></td>
</tr>
<tr>
<td class="meta-head">Amount Due</td>
<td>
<div class="due">
$
<asp:Label ID="lblTotal" runat="server" Text="Total"></asp:Label>
</div>
</td>
</tr>
</table>
</div>
<table id="items">
<tr>
<th>Property Title</th>
<th>Description</th>
<th>Status</th>
<th>Invoiced By</th>
<th>Total Payment</th>
</tr>
<tr class="item-row">
<td class="item-name">
<div class="delete-wpr">
<textarea readonly="readonly" id="tbTitle" runat="server"></textarea>
</div>
</td>
<td class="description">
<div contenteditable="true" id="tbDetail" class="blank" runat="server">
</div>
</td>
<td>
<textarea id="tbStatus" runat="server" readonly="readonly">PAID</textarea></td>
<td>
<textarea class="qty" readonly="readonly" id="tbInvoicedBy" runat="server"></textarea></td>
<td><span class="price">$
<asp:Label ID="tbTotal1" runat="server" Text="Total"></asp:Label></span></td>
</tr>
<tr>
<td colspan="2" class="blank"></td>
<td colspan="2" class="total-line">Vaccant</td>
<td class="total-value">
<div id="subtotal">$<asp:Label ID="lblVaccant" runat="server" Text=""></asp:Label></div>
</td>
</tr>
<tr>
<td colspan="2" class="blank"></td>
<td colspan="2" class="total-line">Maintainance</td>
<td class="total-value">
<div id="total">$<asp:Label ID="lblMaintainance" runat="server" Text=""></asp:Label></div>
</td>
</tr>
<tr>
<td colspan="2" class="blank"></td>
<td colspan="2" class="total-line">Property Insurance</td>
<td class="total-value">
<div id="Insurance">$<asp:Label ID="lblInsurance" runat="server" Text=""></asp:Label></div>
</td>
</tr>
<tr>
<td colspan="2" class="blank"></td>
<td colspan="2" class="total-line">Dewa Bill</td>
<td class="total-value">
<div id="dewa">$<asp:Label ID="lblDewa" runat="server" Text=""></asp:Label></div>
</td>
</tr>
<tr>
<td colspan="2" class="blank"></td>
<td colspan="2" class="total-line">Furnishing Cost</td>
<td class="total-value">
<div id="FurnishingCost">$<asp:Label ID="lblFurnishing" runat="server" Text=""></asp:Label></div>
</td>
</tr>
<tr>
<td colspan="2" class="blank"></td>
<td colspan="2" class="total-line">Cleaning Fees</td>
<td class="total-value">
<div id="CleaningFees">$<asp:Label ID="lblCleaning" runat="server" Text=""></asp:Label></div>
</td>
</tr>
<tr>
<td colspan="2" class="blank"></td>
<td colspan="2" class="total-line">House Keeping</td>
<td class="total-value">
<div id="HouseKeeping">$<asp:Label ID="lblHouseKeeping" runat="server" Text=""></asp:Label></div>
</td>
</tr>
<tr>
<td colspan="2" class="blank"></td>
<td colspan="2" class="total-line">Next Rent Due</td>
<td class="total-value">
<div id="paid">$<asp:Label ID="lblNextRent" runat="server" Text=""></asp:Label></div>
</td>
</tr>
<tr>
<td colspan="2" class="blank"></td>
<td colspan="2" class="total-line">Rental Comission</td>
<td class="total-value">
<div id="RentalComission">$<asp:Label ID="lblRentalComission" runat="server" Text=""></asp:Label></div>
</td>
</tr>
<tr>
<td colspan="2" class="blank"></td>
<td colspan="2" class="total-line">Credit Card Fees</td>
<td class="total-value">
<div id="CreditCardFees">$<asp:Label ID="lblCreditCardFees" runat="server" Text=""></asp:Label></div>
</td>
</tr>
<tr>
<td colspan="2" class="blank"></td>
<td colspan="2" class="total-line">Pest Control</td>
<td class="total-value">
<div id="PestControl">$<asp:Label ID="lblPestControl" runat="server" Text=""></asp:Label></div>
</td>
</tr>
<tr>
<td colspan="2" class="blank"></td>
<td colspan="2" class="total-line">Chillar Utilities</td>
<td class="total-value">
<div id="ChillarUtilities">$<asp:Label ID="lblChillarUtilities" runat="server" Text=""></asp:Label></div>
</td>
</tr>
<tr>
<td colspan="2" class="blank"></td>
<td colspan="2" class="total-line">Du, etisilate wifi</td>
<td class="total-value">
<div id="DuEtisilatewifi">$<asp:Label ID="lblDuEtisilateWifi" runat="server" Text=""></asp:Label></div>
</td>
</tr>
<tr>
<td colspan="2" class="blank"></td>
<td colspan="2" class="total-line balance">Total Payment</td>
<td class="total-value balance">
<div class="due">$<asp:Label ID="lblTotal2" runat="server" Text=""></asp:Label></div>
</td>
</tr>
</table>
<div id="terms">
<h5>Terms</h5>
<textarea readonly="readonly">These payment details are final and non negotiable.</textarea>
</div>
</div>
</asp:Panel>
ASPX.CS
public void ExportToPDF()
{
Response.ContentType = "application/pdf";
Response.AddHeader("content-disposition", "attachment;filename=Panel.pdf");
Response.Cache.SetCacheability(HttpCacheability.NoCache);
StringWriter sw = new StringWriter();
HtmlTextWriter hw = new HtmlTextWriter(sw);
pnl.RenderControl(hw);
StringReader sr = new StringReader(sw.ToString());
Document pdfDoc = new Document(PageSize.A4, 10f, 10f, 100f, 0f);
HTMLWorker htmlparser = new HTMLWorker(pdfDoc);
PdfWriter.GetInstance(pdfDoc, Response.OutputStream);
pdfDoc.Open();
htmlparser.Parse(sr);
pdfDoc.Close();
sw.Close();
htmlparser.Close();
Response.Write(pdfDoc);
Response.End();
}
also it says the HTMLWorker class is obsolete.
i read so many solutions and blogs on this but still not able to get it done.
I have a Repeater in my code, which has labels in ItemTemplate. I need to do a client side validation (using jQuery) on the values entered in the TextBox on a button click event. i have some value in my label which I want to access to make comparision between the values entered in the textbox and text of label. Now I added a custom attribute named datakey to the label and textbox both, so that comparision is easy.
I access the text box and get the datakey attribute.
I get the label with the datakey value same as that of textbox and do my comparision.
Now in Jquery I am not able to access that label.
This is what i wrote in Jquery:
var lbl = $("label").find("[datakey='" + expID + "']");
ASP Code.
<table class="tblDispData">
<asp:Repeater ID="PrjBudgetDetails" runat="server" ClientIDMode="Static">
<HeaderTemplate>
<tr>
<th class="thDataDisp">
<asp:Label ID="LbExpType" runat="server" Text="Expenditure Type" CssClass="LbTblDataDisp"
Font-Bold="true"></asp:Label>
</th>
<th class="thDataDisp">
<asp:Label ID="LbAllocatedBudget" runat="server" Text="Allocated Budget" CssClass="LbTblDataDisp"
Font-Bold="true"></asp:Label>
</th>
<th class="thDataDisp">
<asp:Label ID="LbAvailedBudget" runat="server" Text="Available Budget" CssClass="LbTblDataDisp"
Font-Bold="true"></asp:Label>
</th>
<th class="thDataDisp">
<asp:Label ID="LbRequestedBudget" runat="server" Text="Budget Requested" CssClass="LbTblDataDisp"
Font-Bold="true"></asp:Label>
</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td class="tdDataDisp">
<asp:Label ID="ExpTypeText" runat="server" Text='<%#Eval("ExpType") %>' CssClass="LbTblDataDisp"
AssociatedControlID="BudgetRequestedText"></asp:Label>
</td>
<td class="tdDataDisp">
<asp:Label ID="BudgetAllocatedText" runat="server" Text='<%#Eval("BudgetAllocated") %>'
CssClass="LbTblDataDisp" AssociatedControlID="BudgetRequestedText"></asp:Label>
</td>
<td class="tdDataDisp">
<asp:Label ID="BudgetAvailableText" runat="server" dataKey='<%#Eval("ExpID") %>'
Text='<%#Convert.ToDouble(Eval("BudgetAllocated")) - Convert.ToDouble(Eval("BudgetAvailed")) %>'
CssClass="LbTblDataDisp" ClientIDMode="Static" AssociatedControlID="BudgetRequestedText"></asp:Label>
</td>
<td class="tdDataDisp">
<asp:TextBox ID="BudgetRequestedText" runat="server" dataKey='<%#Eval("ExpID") %>'
dataValue='<%#Eval("ExpType") %>' CssClass="tblDataInput"></asp:TextBox>
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
<tr>
<td colspan="3">
<span id="Legend1" class="frmInstructions" runat="server">Please enter zero(0) if not
requesting budget for any particular expenditure. The currency is INR. </span>
</td>
<td>
<asp:Button ID="prjBudgetSubmitBtn" runat="server" Text="Submit Budget" CssClass="formNext"
ClientIDMode="Static" OnClick="prjBudgetSubmitBtn_Click" />
</td>
</tr>
</table>
The RESULTING MARKUP HERE
<table class="tblDispData">
<tr>
<th class="thDataDisp">
<span id="LbExpType" class="LbTblDataDisp" style="font-weight:bold;">Expenditure Type</span>
</th>
<th class="thDataDisp">
<span id="LbAllocatedBudget" class="LbTblDataDisp" style="font-weight:bold;">Allocated Budget</span>
</th>
<th class="thDataDisp">
<span id="LbAvailedBudget" class="LbTblDataDisp" style="font-weight:bold;">Available Budget</span>
</th>
<th class="thDataDisp">
<span id="LbRequestedBudget" class="LbTblDataDisp" style="font-weight:bold;">Budget Requested</span>
</th>
</tr>
<tr>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="ExpTypeText" class="LbTblDataDisp">Hardware</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAllocatedText" class="LbTblDataDisp">9.00</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAvailableText" class="LbTblDataDisp" dataKey="EXP001">7</label>
</td>
<td class="tdDataDisp">
<input name="ctl00$pageMainContent$PrjBudgetDetails$ctl01$BudgetRequestedText" type="text" id="BudgetRequestedText" class="tblDataInput" dataKey="EXP001" dataValue="Hardware" dataAmount="7" />
</td>
</tr>
<tr>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="ExpTypeText" class="LbTblDataDisp">Software</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAllocatedText" class="LbTblDataDisp">9.00</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAvailableText" class="LbTblDataDisp" dataKey="EXP002">9</label>
</td>
<td class="tdDataDisp">
<input name="ctl00$pageMainContent$PrjBudgetDetails$ctl02$BudgetRequestedText" type="text" id="BudgetRequestedText" class="tblDataInput" dataKey="EXP002" dataValue="Software" dataAmount="9" />
</td>
</tr>
<tr>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="ExpTypeText" class="LbTblDataDisp">Software AMC</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAllocatedText" class="LbTblDataDisp">9.00</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAvailableText" class="LbTblDataDisp" dataKey="EXP003">9</label>
</td>
<td class="tdDataDisp">
<input name="ctl00$pageMainContent$PrjBudgetDetails$ctl03$BudgetRequestedText" type="text" id="BudgetRequestedText" class="tblDataInput" dataKey="EXP003" dataValue="Software AMC" dataAmount="9" />
</td>
</tr>
<tr>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="ExpTypeText" class="LbTblDataDisp">Hardware AMC</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAllocatedText" class="LbTblDataDisp">9.00</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAvailableText" class="LbTblDataDisp" dataKey="EXP004">9</label>
</td>
<td class="tdDataDisp">
<input name="ctl00$pageMainContent$PrjBudgetDetails$ctl04$BudgetRequestedText" type="text" id="BudgetRequestedText" class="tblDataInput" dataKey="EXP004" dataValue="Hardware AMC" dataAmount="9" />
</td>
</tr>
<tr>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="ExpTypeText" class="LbTblDataDisp">UPS</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAllocatedText" class="LbTblDataDisp">9.00</label>
</td>
<td class="tdDataDisp">
<label for="BudgetRequestedText" id="BudgetAvailableText" class="LbTblDataDisp" dataKey="EXP006">9</label>
</td>
<td class="tdDataDisp">
<input name="ctl00$pageMainContent$PrjBudgetDetails$ctl05$BudgetRequestedText" type="text" id="BudgetRequestedText" class="tblDataInput" dataKey="EXP006" dataValue="UPS" dataAmount="9" />
</td>
</tr>
<tr>
<td colspan="3">
<span id="pageMainContent_Legend1" class="frmInstructions">Please enter zero(0) if not
requesting budget for any particular expenditure. The currency is INR. </span>
</td>
<td>
<input type="submit" name="ctl00$pageMainContent$prjBudgetSubmitBtn" value="Submit Budget" id="prjBudgetSubmitBtn" class="formNext" />
</td>
</tr>
</table>
Thanks in advance.
Following code will give you the related label.
$("label[dataKey='" + expID + "']")
Demo
I have a table (with two textboxes Item and Count) in my webpage.
I try to access the values of two textboxes in each rows.
Please see my code below
<table id="tbl-contents" class="table">
<thead>
<tr>
<th>Item</th>
<th>Count</th>
<th></th>
</tr>
</thead>
<tbody>
<tr class="clsRow">
<td>
#*
<input type="text" class="form-control" placeholder="Item" data-required="true">*#
<input id="txtItem" class="form-control" placeholder="Item" type="text" value="" tabindex="-1" name="" data-required="true">
</td>
<td>
#*
<input type="text" class="form-control" placeholder="Item Count" data-required="true">*#
<input id="txtItemCount" class="form-control" placeholder="Item Count" type="text" value="" tabindex="-1" name="" data-required="true">
</td>
</tr>
<tr class="clsRow">
<td>
<input type="text" class="form-control" placeholder="Item">
</td>
<td>
<input type="text" class="form-control" placeholder="Item Count">
</td>
<td>
<a class="clsDelContent"><i class="fa fa-minus-square" style="font-size: 22px;"></i></a>
</td>
</tr>
<tr class="clsRow">
<td>
<input type="text" class="form-control" placeholder="Item">
</td>
<td>
<input type="text" class="form-control" placeholder="Item Count">
</td>
<td>
<a class="clsDelContent"><i class="fa fa-minus-square" style="font-size: 22px;"></i></a>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="3" style="text-align: right;">
<a class="clsAddContent"><i class="fa fa-plus-square" style="font-size: 22px;"></i></a>
</td>
</tr>
</tfoot>
</table>
Script
$('#tbl-contents tbody tr').each(function () {
var customerId = $(this).find("td").html();
alert(customerId);
});
$('.clsRow').each(function() {
var foo = $(this).find('input');
var item = foo[0].value;
var itemcount = foo[1].value;
})
JSFiddle
You could try:
$('table tbody tr td input').each(function(){
console.log($(this).val())
});
LIVE DEMO
You can use the following script.
var reqValues = [];
$('.clsRow').each(function(i){
var $currentTD = $(this).find('td')
reqValues["item"+i] = $currentTD.eq(0).find('input').val();
reqValues["values"+i] = $currentTD.eq(1).find('input').val();
});
To get a particular value use the following code -
reqValues["item1"]
reqValues["values1"]
reqValues["item2"]
reqValues["values2"]
I want to Use only the HTML Controls on my page. For that i want to use some text boxes and a HTML select(List box) and a Submit button for Post Event.
The Code is as follows:
<script type="text/javascript">
function dropdown(mySel) {
var myWin, myVal;
myVal = mySel.options[mySel.selectedIndex].value;
if (myVal) {
if (mySel.form.target) myWin = parent[mySel.form.target];
else myWin = window;
if (!myWin) return true;
myWin.location = myVal;
}
return false;
}
</script>
This Java Script i am using for the HTML Select List.
The Rest of the Code are As follows:
<form action="feedback.aspx" method="post" onsubmit="return dropdown(this.feeds)">
<h1>
Let us know your inconvenience for the following Listing:
</h1>
<table>
<tr>
<td>
<b>Type : </b>
</td>
<td>
<asp:Label ID="lbltype" runat="server"></asp:Label>
</td>
</tr>
<tr>
<td>
<b>ID : </b>
</td>
<td>
<asp:Label ID="lblID" runat="server"></asp:Label>
</td>
</tr>
<tr>
<td>
<b>Title: </b>
</td>
<td>
<asp:Label ID="lblTitle" runat="server"></asp:Label>
</td>
</tr>
</table>
<table>
<tr>
<td>
User ID:
</td>
<td>
<input type="text" name="txtUserid" />
</td>
</tr>
<tr>
<td>
Name:
</td>
<td>
<input type="text" name="txtName" />
</td>
</tr>
<tr>
<td>
Contact:
</td>
<td>
<input type="text" name="txtContact" />
</td>
</tr>
<tr>
<td>
Email:
</td>
<td>
<input type="text" name="txtemail" />
</td>
</tr>
</table>
<br />
<table cellpadding="5" cellspacing="5" width="500px">
<tr>
<td style="width: 400px">
<b>Please Select the given option </b>
</td>
</tr>
<tr>
<td style="width: 400px">
<select name="feeds">
<option value="">Choose an Option...</option>
<option value="">Option1</option>
<option value="">Option2</option>
<option value="">Option3</option>
</select>
</td>
</tr>
<tr>
<td style="width: 400px">
<b>Write your Comment Here: </b>
<br />
<textarea id="TextArea" name="txtcomment" cols="45" rows="5"></textarea>
</td>
<td>
</td>
</tr>
<Efextra:Captcha ID="Captcha1" runat="server" TabIndex="29" ValidationErrorMessage="Verification Code"
ValidationGroup="Feeds" ValidationText="*"></Efextra:Captcha>
<tr>
<td>
<input type="submit" value="Submit FeedBack" validationgroup="Feeds" />
</td>
</tr>
</table>
</form>
I have a XML document having the following Format:
<?xml version="1.0" encoding="utf-8" ?>
<Feedback>
<Options>
<ID>0</ID>
<option>[Select your option]</option>
</Options>
<Options>
<ID>1</ID>
<option>I got Incomplete/wrong information posted here.</option>
</Options>
<Options>
<ID>2</ID>
<option>The Content is not in Proper Format.</option>
</Options>
<Options>
<ID>3</ID>
<option>How can get the similar type of properties?</option>
</Options>
<Options>
<ID>4</ID>
<option>This Listing is Sold and Still Displaying here.</option>
</Options>
<Options>
<ID>5</ID>
<option>I can not send SMS for this Listing.</option>
</Options>
<Options>
<ID>6</ID>
<option>I can not get the Contact Information of the owner of this post.</option>
</Options>
<Options>
<ID>7</ID>
<option>My problem is not given here!</option>
</Options>
</Feedback>
Now what i ahve to do is:
When Page load it checks whether the user is registered or not, if he/She is a registered user, the first four field [User ID, Name, Contact, Email] can be be loaded itself.
for this my code behind file assigns value like this:
User FeedUser = Propertywala.User.GetAuthUser();
Txt1.Text=Feeduser.UserID; and so on..
If he/she is not a registered user then User will get this field blank and i will get fetch all the filled values through Page.Request().
Second Issue is that i want to load the Option of select box from XML file which is above.
I am a newbie to this code and flow. so please anybody can help me doing this.
Thanks in Advance.
You'll need to assign the runat="server" attribute to the input type="text" controls as well. Then you can access them in codebehind just like a webcontrol. The same goes for your select html control.
For the Xml document you're going to need an XmlReader object. For the implementation of that, please look up MSDN
Finally i did it without using a single asp control. I solved the problem like this:
<form name="feedback" action="FeedBack.aspx">
<h1>
Let us know your inconvenience for the following Listing:
</h1>
<table>
<%if (IsUserLoggedIn) %>
<%{ %>
<tr>
<td>
<b>User ID:</b>
</td>
<td>
<input type="text" value="<%=VisitingUser.UserIdn%>" size="30" readonly="readonly" />
</td>
</tr>
<tr>
<td>
<b>Name:</b>
</td>
<td>
<input type="text" value="<%=VisitingUser.FullName%>" size="30" readonly="readonly" />
</td>
</tr>
<tr>
<td>
<b>Contact:</b>
</td>
<td>
<input type="text" value="<%=VisitingUser.MobileNumber %>" size="30" readonly="readonly" />
</td>
</tr>
<tr>
<td>
<b>Email:</b>
</td>
<td>
<input type="text" value="<%=VisitingUser.PrimaryEmail%>" size="30" readonly="readonly" />
</td>
</tr>
<%} %>
<%else%>
<%{ %><tr>
<td>
<h3>
Enter the Folowing details to submit the Feedback:
</h3>
</td>
</tr>
<tr>
<td>
Name:
</td>
<td>
<input type="text" name="txtName" />
</td>
</tr>
<tr>
<td>
Contact:
</td>
<td>
<input type="text" name="txtContact" />
</td>
</tr>
<tr>
<td>
Email:
</td>
<td>
<input type="text" name="txtEmail" />
</td>
</tr>
<%} %>
</table>
<br />
<%if (int.TryParse(Request.QueryString["property"], out Property)) %>
<%{ %>
<%Propertywala.Property prp = new Propertywala.Property(Property);%>
<%if (prp.OwnerId > 0) %>
<%{ %>
<table>
<tr>
<td>
<b>Property ID :</b>
</td>
<td>
<%=Property.ToString() %>
</td>
</tr>
<tr>
<td>
<b>Property Title :</b>
</td>
<td>
<%=prp.AutoGeneratedTitle %>
</td>
</tr>
</table>
<%} %>
<%} %>
<%else if (int.TryParse(Request.QueryString["project"], out Project)) %>
<%{ %>
<%Propertywala.Project prj = new Propertywala.Project(Project);%>
<%if (prj.UserId > 0) %>
<%{ %><table>
<tr>
<td>
<b>Project ID : </b>
</td>
<td>
<%=Project.ToString() %>
</td>
</tr>
<tr>
<td>
<b>Project Title : </b>
</td>
<td>
<%=prj.Title %>
</td>
</tr>
</table>
<%} %>
<%} %>
<table cellpadding="5" cellspacing="5" width="500px">
<tr>
<td style="width: 400px">
<b>Please Select the given option </b>
</td>
</tr>
<tr>
<td style="width: 400px">
<select name="feeds">
<%foreach (System.Xml.XmlNode xNode in FeedXmlList)%>
<%{ %>
<option value="<%=xNode.ChildNodes[1].InnerText%>">
<%=xNode.ChildNodes[1].InnerText%></option>
<%} %>
</select>
</td>
</tr>
<tr>
<td style="width: 400px">
<b>Write your Comment Here: </b>
<br />
<textarea name="txtcomment" cols="45" rows="5"></textarea>
</td>
<td>
</td>
</tr>
<Efextra:Captcha ID="Captcha1" runat="server" TabIndex="29" ValidationErrorMessage="Verification Code"
ValidationGroup="Feeds" ValidationText="*"></Efextra:Captcha>
<tr>
<td>
<input type="submit" value="Submit FeedBack" />
</td>
</tr>
</table>
</form>
And finally in Code behind file i just put some required condition and fetch all the html values through request.form, like this:
if (Request.HttpMethod.ToLower() == "post" && Request.Form.Count > 0)
{
if (!string.IsNullOrEmpty(Request.Form["feeds"]) || !string.IsNullOrEmpty(Request.Form["txtcomment"]))
{
if (!string.IsNullOrEmpty(Request["property"]) || !string.IsNullOrEmpty(Request["project"]))
{
if (IsUserLoggedIn||(!IsUserLoggedIn && !string.IsNullOrEmpty(Request["txtName"]) && !string.IsNullOrEmpty(Request["txtContact"]) && !string.IsNullOrEmpty(Request["txtEmail"])))
{
if (Request.Form["feeds"] != "[Select your option]")
{
Mail(Request.Form["feeds"], Request.Form["txtcomment"]);
}
else
{
Common.ClientMessage("Select the Option and Retry to Submit the feeds.", CommonConsts.AlertType.info);
}
}
else
{
Common.ClientMessage("Unregistered user must fill their name and Contact Details!", CommonConsts.AlertType.info);
}
}
}
}