We Keep Coding

how to subtract asp textbox values and put result in asp label

I am trying to get the values from two text boxes, subtract the values and return the difference in an a label as the values are typed in. I have tried the below code and am having no luck. What is the best way to do this? This is running on asp.net page with a master page.
.ASPX
<asp:TextBox ID="txtWeek1FridayAM_IN" runat="server" class="numeric" Width="40px" >0.00</asp:TextBox>
<asp:Label ID="lblWeek1FridayTotalHrs" runat="server" class="numeric" Text="0"></asp:Label>
<asp:TextBox runat="server" ID="txtWeek1FridayAM_OUT" class="numeric" width="40px" OnTextChanged="OUTvalidation" >0.00</asp:TextBox>
aspx.cs
$(document).ready(function () {
sum();
$("#txtWeek1FridayAM_IN, #txtWeek1FridayAM_OUT").on("keydown keyup", function () {
sum();
});
});
function sum() {
var num1 = document.getElementById('#txtWeek1FridayAM_IN').value;
var num2 = document.getElementById('#txtWeek1FridayAM_OUT').value;
var result = parseFloat(num2) - parseFloat(num1);
if (!isNaN(result)) {
document.getElementById('#lblWeek1FridayTotalHrs').value = result;
}
}

Few points:
If you need to reference the control IDs in client-side script, you can use <%= control_id.ClientID %>.
label or span element does not have value property, use textContent instead.
I prefer input instead of keyup and keydown.
I am having some issue with OnTextChanged="OUTvalidation" while running the code. But able to execute successfully by removing that from the control.
Change you code to the following:
$(document).ready(function () {
sum();
$("body").on("input", "#<%=txtWeek1FridayAM_IN.ClientID%>, #<%=txtWeek1FridayAM_OUT.ClientID%>", function () {
sum();
});
});
function sum() {
var num1 = document.getElementById('<%=txtWeek1FridayAM_IN.ClientID%>').value;
var num2 = document.getElementById('<%=txtWeek1FridayAM_OUT.ClientID%>').value;
var result = parseFloat(num2) - parseFloat(num1);
if (!isNaN(result)) {
document.getElementById('<%=lblWeek1FridayTotalHrs.ClientID%>').textContent = result;
}
}

Use this script
$(document).ready(function () {
sum();
$('[id$="txtWeek1FridayAM_IN"], [id$="txtWeek1FridayAM_OUT"]').on("keyup", function () {
sum();
});
});
function sum() {
var num1 = $('[id$="txtWeek1FridayAM_IN"]').val();
var num2 = $('[id$="txtWeek1FridayAM_OUT"]').val();
var result = parseFloat(num2) - parseFloat(num1);
if (!isNaN(result)) {
$('[id$="lblWeek1FridayTotalHrs"]').html(result);
}
}

you can put onkeyup in textbox control
<asp:TextBox runat="server" ID="txtWeek1FridayAM_OUT" class="numeric" width="40px" OnTextChanged="OUTvalidation" onkeyup="sum(); return false" >0.00</asp:TextBox>

Have you tried this with onkeypress="SUM()":
ASP :
<asp:TextBox ID="txtWeek1FridayAM_IN" onkeypress="SUM()" runat="server" class="numeric" Width="40px" >0.00</asp:TextBox>
<asp:Label ID="lblWeek1FridayTotalHrs" runat="server" class="numeric" Text="0"></asp:Label>
<asp:TextBox runat="server" ID="txtWeek1FridayAM_OUT" onkeypress="SUM();" class="numeric" width="40px" OnTextChanged="OUTvalidation" >0.00</asp:TextBox>
Script:
function SUM() {
var num1 = $('input[id=<%=txtWeek1FridayAM_IN.ClientID%>]').val();
var num2 = $('input[id=<%=txtWeek1FridayAM_OUT.ClientID%>]').val();
var result = parseFloat(num2) - parseFloat(num1);
if (!isNaN(result)) {
document.getElementById('<%=lblWeek1FridayTotalHrs.ClientID %>').value = result;
}
}
Please note :
You can specify the javascript method at the time of defining the controls, no need to depend on document.ready for this. like what we did onkeypress="SUM()"
Since you are using ASP controls the ID of the control may not be the same as you defined. master page may also have a role in this. so better to use ClientID

Try this, this will work
.aspx page
<asp:TextBox ID="txtWeek1FridayAM_IN" runat="server" class="numeric" Width="40px" >0.00</asp:TextBox>
<asp:Label ID="lblWeek1FridayTotalHrs" runat="server" class="numeric" Text="0"></asp:Label>
<asp:TextBox runat="server" ID="txtWeek1FridayAM_OUT" class="numeric" width="40px" OnTextChanged="OUTvalidation" >0.00</asp:TextBox>
.cs page
protected void OUTvalidation(object sender, EventArgs e)
{
int val1 = Convert.ToInt32(txtWeek1FridayAM_IN.Text);
int val2 = Convert.ToInt32(txtWeek1FridayAM_OUT.Text);
int val3 = val1 - val2;
lblWeek1FridayTotalHrs.Text = val3.ToString();
}
If you enter values in both the textboxes and click enter on the second textbox it will display value on the label.

Passing variable into JavaScript getElementById

I have a simple JavaScript problem. Here is an example:
function test()
{
for(int i=1; i<5; i++)
{
var value[i] = 100*i;
var x = accountname + value[i];
document.getElementById(x).value = value + '_'+"TestName";
}
}
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<telerik:RadTextBox RenderMode="Lightweight" ID="accountname100" AutoCompleteType="HomePhone" runat="server"
Label="account #1:" /><br />
<telerik:RadTextBox RenderMode="Lightweight" ID="accountname200" AutoCompleteType="HomePhone" runat="server"
Label="account #2:" /><br />
<telerik:RadTextBox RenderMode="Lightweight" ID="accountname300" AutoCompleteType="HomePhone" runat="server"
Label="account #3:" /><br />
<telerik:RadTextBox RenderMode="Lightweight" ID="accountname400" AutoCompleteType="HomePhone" runat="server"
Label="account #4:" /><br />
</asp:Content>
I am trying to find the correct syntax so that the value of parameter "x" can be in the radtextbox correctly.

I think there are a few issues here. One is using value to set the value of the input when it has never been set and another is using accountname, when it should be a string "accountname". I have created a fiddle which is roughly what I think you're trying to achieve. Hope that helps

here is some seems to you pretended
function test() {
value = [];
for(var i=1; i<5; i++) {
value.push(100*i);
var x = accountname + value[i];
document.getElementById('accountname'+x).value = value + '_' + "TestName";
}
}
Details:
in javascript vars don't have types their type is dinamic
so to declarate any type of variable you have to do this
var number = 10;
var name = "Jhon";
var money = 3.23;
var arrayNumbers = [1,2];
I suggest you to see some basic guide to javascript.

How to get multiple value from html inputs that generated by C#

I have multiple Html inputText that is generated on page load by C#. This is my stored procedure:
ALTER PROCEDURE [dbo].[CharacteristicsFetch]
AS
BEGIN
SELECT chId, chName, chDesc
FROM Characteristics
ORDER BY chName
END
and my C# code:
public string generate_CharValues()
{
string post = "";
DataTable dt = cls.Fill_In_DataTable("CharacteristicsFetch");
if (dt.Rows.Count > 0)
{
for (int i = 0; i < dt.Rows.Count; i++)
{
post += "<input id='" + dt.Rows[i]["chId"] + "' name='txt" + dt.Rows[i]["chId"] + "' title='" + dt.Rows[i]["chName"] + "' type='number' required='required' />";
}
}
return post;
}
I called this function from an .aspx page that I want use it:
charValues = cls.generate_CharValues();
The code will generate multiple html inputs that user must provide values for. Each input text has an Id related to it's database Id. Now I want get input values and input Ids then put them on a datatable to send it to database.
This is my try on submit test button:
DataTable dtChar = new DataTable();
dtChar.Columns.AddRange(new DataColumn[3] {
new DataColumn("chId", typeof(string)),
new DataColumn("animalId", typeof(string)),
new DataColumn("Rank", typeof(string))});
string animalId = "1";//animalId
int getcount = int.Parse(clsData.Select_One_Data("CharacteristicsGetCount", "chCount").ToString());
for(int i = 0; i < getcount; i++)
{
string chId = "";//input text id
string rank = "";//Request.Form["input text value"]
dtChar.Rows.Add(chId, animalId, rank);
}
any method with JS or JQuery will help me too. Thanks

i am sorry for the wrong answer
i was in hurry
try this
it wok for me and returns list of strings
<form id="form1" runat="server">
<div>
<asp:TextBox ID="TextBox4" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="check()" />
<asp:Button ID="Button2" runat="server" Text="Button" OnClick="Button1_Click"/>
<input type="hidden" id="hdn" runat="server" />
</div>
<script>
function check() {
var val = document.getElementsByTagName("input");
var d = "";
for (var i = 0; i < val.length; i++) {
if (val[i].value != null && val[i].type == 'number') {
d += val[i].value+',';
}
}
d = d.slice(0, d.length-1);
document.getElementById("hdn").value = d;
}
</script>
</form>
and the code behind
protected void Button1_Click(object sender, EventArgs e)
{
string cd = hdn.Value;
List<string> values =cd.Split(',').ToList();
}

validate user control input value

How to validate user control textbox value on Parent page? I have the following code but it couldn't find the control. I have checked IE View Source(HTML) and this control renders as
ctl00_Management_Initiation_txtTitle_txtInput
How to get the value using JQuery? Please let me know.
User Control
<telerik:RadTextBox id="txtInput" runat="server" TextMode="MultiLine" LabelCssClass=""></telerik:RadTextBox>
<asp:image id="ImgRequired1" ImageUrl="../../images/requiredfield.gif" AlternateText="Required Field" Runat="server" Visible=false></asp:image><br />
.aspx page
<script type="text/javascript">
$(document).ready(function () {
$("#<%=btnSave.ClientID %>").click(function () {
var valid = true;
var msg = "Please fill form:\n";
if($("input[id*=txtTitle]").val().length == 0{
msg += "Title is Required!\n";
valid = false;
}
});
});
</script>
<uc1:ControlTextBox ID="txtTitle" runat="server" MaxLength="200" ></uc1:ControlTextBox>
<asp:Button ID="btnSave" name="btnSave" runat="server" Text="Save" />

if($("#<%= txtTitle.TextInputClientID %>").val().length == 0) {
There is serious lack of closing brackets, both "}" and ")" in your javascript.
Add property to your user control:
public string TextInputClientID { get { return txtInput.ClientID; } }

making textbox readonly in javascript

I am having two radio buttons and two textbox. When I click on first checkbox, both texbox should not be readonly. But when I select second radio button it should make both text box readonly. I googled and found many solutions but don't know why none is not working in my code.
Html:
<asp:RadioButton ID="mailNew" Text="New" runat="server" GroupName="mail_select" onclick="showHide(1)" ClientIDMode="Static" /><br />
<asp:RadioButton ID="mailExisting" Text="Existing" runat="server" GroupName="mail_select" onclick="showHide(2)" ClientIDMode="Static" />
<asp:TextBox ID="txtPromotion" runat="server" Width="77px" ></asp:TextBox><br />
<asp:TextBox ID="txtSubject" runat="server" Width="288px"></asp:TextBox><br />
Javascript:
function showHide(val) {
var txtpid=document.getElementById(<% = txtPromotion %>)
var txtsub= document.getElementById('<% = txtSubject.ClientID %>');
if (val == 2) {
txtpid.readOnly = false;
txtsub.readOnly = false;
}
if (val == 1) {
txtsub.setAttribute("readOnly.true");
txtpid.setAttribute("readOnly,true");
}
}

I see two issues:
You're not using ClientID for txtPromotion.
You're calling setAttribute with an incorrect attribute name and no value at all.
Just use the reflected property consistently in your code:
function showHide(val) {
var txtpid=document.getElementById('<% = txtPromotion.ClientID %>')
var txtsub= document.getElementById('<% = txtSubject.ClientID %>');
if (val == 2) {
txtpid.readOnly = false;
txtsub.readOnly = false;
}
else if (val == 1) {
txtsub.readOnly = true;
txtpid.readOnly = true;
}
}
Note that your code assumes val will never be anything other than 1 or 2, because it doesn't update readOnly unless it's one of those two values. With that in mind, this might be cleaner:
function showHide(val) {
document.getElementById('<% = txtPromotion.ClientID %>').readOnly = val == 1;
document.getElementById('<% = txtSubject.ClientID %>').readOnly = val == 1;
}