problem is I have a date text box and a shifts drop down. When I select a date and shift I get the list of employees. dropdown has a onSelectedIndexChanged event, so employee list will be populate only if we change shifts. So for date chage I have added ajavascript to reset shift dropdown to 0 index. therefore every time when you change the date you have to select the shift too and the selectindex change event will be fired.BUT the problem is when I reset shifts dropdown from javascript it is done only in client side not in server side.So if I select dropdownt to the previous value it doesn't fire the change event but for other values it works fine.
<asp:TextBox ID="txtSelectDate" runat="server" CssClass="inputAddRes" onchange="javascript:return ResetShifts();"></asp:TextBox>
<asp:DropDownList ID="ddlShifts" AutoPostBack="true" OnSelectedIndexChanged="ddlShifts_SelectedIndexChanged" runat="server" >
<asp:ListItem Text="Morning" Value="1"/>
<asp:ListItem Text="Evening" Value="2"/>
<asp:ListItem Text="Night" Value="3"/>
</asp:DropDownList>
function ResetShifts() {
document.getElementById('<%= ddlShifts.ClientID %>').selectedIndex = 0;
}
You could just call the select onchange event manually
document.getElementById('<%= ddlShifts.ClientID %>').onchange();
Related
I want to call javascript function on Dropdown menu selectedindexchanged. I tried this
<asp:DropDownList ID="selectVehicle" AutoPostBack="true" OnSelectedIndexChanged="GetRoute(this.options[this.selectedIndex].value);" runat="server" CssClass="inners">
<asp:listitem Selected>-- Select Vehicle --</asp:listitem>
<asp:listitem Value="16">Tata Ace</asp:listitem>
<asp:listitem Value="28">Tata 407</asp:listitem>
</asp:DropDownList>
Error
BC30456: 'GetRoute' is not a member of 'ASP.index3_aspx'.
Then I tried onChange instead of OnSelectedIndexChanged but it has no use for me since in my js function values inserted in textbox which is working but when page reloads textbox again gets blank & I can't turn off AutoPostBack since it is required to postback. Is is possible I can run javascript OnSelectedIndexChanged ?
You can use the standard javascript onchange:
<asp:DropDownList ID="selectVehicle" AutoPostBack="false" onchange="GetRoute(this.options[this.selectedIndex].value);" runat="server" CssClass="inners">
</asp:DropDownList>
Assuming GetRoute is a javascript function.
ASP.NET will ignore the onchange attribute and render it in the resulting select element.
Rahul Singh's comment to write the JS code into the server code, and only run the server code, no Javascript, makes sense.
In the event you have to have the JS for some reason, you can remove the autopostback = true, and manually call __doPostBack with parameters, the value your JS is producing for example.
JavaScript: Multiple parameters in __doPostBack
I have a radiobuttonlist on whose change event I want to change the watermark text in a textbox.
But I am not able to call Javascript function from RadioButtonList and also not able to retrieve the value of the selected field.
Below is the code for the same.
<asp:RadioButtonList ID="rdbSelectType" runat="server" CssClass="radioButtonList" RepeatDirection="Horizontal" AutoPostBack="true" OnSelectedIndexChanged="rdbSelectType_SelectedIndexChanged">
<asp:ListItem Selected="True" Value="0" Text="Auto Generate"></asp:ListItem>
<asp:ListItem Value="1" Text="Manually Generate"></asp:ListItem>
</asp:RadioButtonList>
Can anyone help me on this please?
I have a GridView in this GridView there is a column which I use to select date with the use of asp:CalendarExtender. I have multiple rows in GridView which are dynamically generated.
When I click the image button calender pops up and I choose my date.
In some rows I want the User to select date when he clicks image button of that row. sometime I don't want to allow him to select date.
When he tries to change the date or click on the image button, he should get alert message saying that you are not allowed to change the date.
I want to handle it from client side. So please suggest me how to do this.
this is the aspx code.
<asp:TextBox runat="server" ID="StartDateTime" CssClass="search_area_text_vm_small" onclick = "javascript:DateClick(this.id);"></asp:TextBox>
<asp:Image ID="Image1" runat="server" ImageUrl="~/images/image3.jpg" />
<asp:CalendarExtender ID="CalendarExtender1" runat="server" TargetControlID="StartDateTime" PopupButtonID="Image1" Format="yyyy-MM-dd" ></asp:CalendarExtender>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="StartDateTime"
ErrorMessage="*" SetFocusOnError="True"></asp:RequiredFieldValidator>
You can make use of the OnClientDateSelectionChanged event of the CalendarExtender.
Use below code:
<asp:CalendarExtender ID="CalendarExtender1" runat="server" TargetControlID="StartDateTime" PopupButtonID="Image1" Format="yyyy-MM-dd" OnClientDateSelectionChanged="checkIfDateSelected()" >
</asp:CalendarExtender>
<javascript>
function checkIfDateSelected(){
var dateTextBox=document.getElementByid('StartDateTime');
if(dateTextBox!='')
{
alert ('Date once selected cannot be changed');
return false;
}
</javascript>
This will show the info pop up and prevent the form submission if the date has been selected already.
I have a dropdown list whose value is changed based on other controls in the UI using javascript.
I used the following code to change the dropdown list,
document.getElementById("ddlchkStsID").options[2].selected = true;
document.getElementById("ddlchkStsID").value = "3";
But in the code-behind, the ddlchkStsID.SelectedValue is still coming as first option's value.
This the control in aspx page.
<asp:DropDownList ID="ddlchkStsID" runat="server" TabIndex="10" CssClass="meta">
<asp:ListItem Text="TBD" Value="1" />
<asp:ListItem Text="Yes" Value="2" />
<asp:ListItem Text="No" Value="3" />
</asp:DropDownList>
Could someone help me how to get the changed value in the code-behind.
thanks in advance :)
Since the control is running at the server, you should be referencing the control using the ClientID, like this:
document.getElementById("<%=ddlchkStsID.ClientID%>").options[2].selected = true;
Is your JavaScript code actually working?
For some reason none of my setfocus() events were working on the server side of my web app, so I created a Javascript function setfocus that is set to trigger on the onload event of the body tag.
<body onload="SetFocus()">
The user will click a radio button which enables the drop down. they select from the drop down which enables the textbox. When they scan a barcode into the textbox it will automatically tab out of the field, therefore triggering the onchange event to call some server side code which, if a successful SQL insert is completed, will insert a new row to the gridview, and it should set focus automatically back to the textbox via Javascript. Once that gridview object has more than a header and a row of data, I disable the drop down and radio button list, so if you look at the Javascript below, I can't use those as criteria in my if statement anymore.
Javascript:
var MatAllRB = document.getElementById("HF_RB_MatAll").value;
var MatAllCL = document.getElementById("DD_SelectCL_All").value;
var MatAll = document.getElementById("Txt_MatBC_All");
var MatAllPrompt = document.getElementById("HF_AllPrompt").value;
var count = $("#GV_Scan_All tr").children().length;
This works perfectly:
else if (ActiveTab == "cont-3" && MatAllRB != "" && MatAllCL != "")
{ alert("went into setfocus");
document.getElementById("Txt_MatBC_All").focus();
alert("made it through setfocus");
}
This only works if you actually click off the field, the tab doesn't work. It just does nothing.
else if (ActiveTab == "cont-3" && count == 9)
{ alert("went into setfocus");
document.getElementById("Txt_MatBC_All").focus();
alert("made it through setfocus");
}
This does the same thing as the above:
else if (ActiveTab == "cont-3" && (MatAllPrompt == "RP" || MatAllPrompt == "P03"))
{ alert("went into setfocus");
document.getElementById("Txt_MatBC_All").focus();
alert("made it through setfocus");
}
The weird thing is that all of these alerts that I have in here show up correctly, it just never sets focus. I am pretty new at this stuff still, so maybe I'm missing something, but I can't figure out why the focus() will work for click off rather than tabbing off. Any help would be appreciated.
Here's the HTML:
<asp:RadioButtonList runat="server" ID="RB_Mat_All" AutoPostBack="true" RepeatColumns="4" OnSelectedIndexChanged="RB_Mat_All_OnSelectedIndexChange">
<asp:ListItem Text="NC" value="NC"></asp:ListItem>
<asp:ListItem Text="DA" value="DA"></asp:ListItem>
<asp:ListItem Text="GW" value="GW"></asp:ListItem>
<asp:ListItem Text="PC" value="PC"></asp:ListItem>
</asp:RadioButtonList>
<asp:HiddenField runat="server" ID="HF_RB_MatAll"></asp:HiddenField >
<br />
<asp:DropDownList runat="server" ID="DD_SelectCL_All" AutoPostBack="true" OnSelectedIndexChanged="DD_SelectCL_All_OnSelectedIndexChange">
<asp:ListItem Value="" Text="Select..."></asp:ListItem>
<asp:ListItem value="53" text="05"></asp:ListItem>
<asp:ListItem value="54" text="06"></asp:ListItem>
<asp:ListItem value="55" text="07"></asp:ListItem>
<asp:ListItem value="57" text="08"></asp:ListItem>
<asp:ListItem value="58" text="09"></asp:ListItem>
</asp:DropDownList>
<asp:label runat="server" ID="Lbl_All_Prompt" CssClass="Form" Text=""></asp:label>
<asp:HiddenField runat="server" ID="HF_AllPrompt"></asp:HiddenField >
<asp:TextBox runat="server" ID="Txt_MatBC_All" Cssclass="Form" Text="" AutoPostBack="true" OnTextChanged="Txt_MatBC_All_TextChanged"></asp:TextBox>
<asp:GridView runat="server" ID="GV_Scan_All" CssClass="Form_Feedback"></asp:GridView>
When I view the source the textbox looks like this:
<input name="Txt_MatBC_All" type="text" onchange="javascript:setTimeout('__doPostBack(\'Txt_MatBC_All\',\'\')', 0)" onkeypress="if (WebForm_TextBoxKeyHandler(event) == false) return false;" id="Txt_MatBC_All" class="Form" />
It's odd that you can click off the field and it works, but tabbing off doesn't. Try adding tabIndexes to the inputs on your page.
The ids of your text box, change when the asp.net render the page. So try this to get the id dynamically and see if its works.
document.getElementById("<%=Txt_MatBC_All.ClientID%>").focus();
The same way you must use the ClientID on every getElementById you use.
by the way, on every line you focus the same text control (Txt_MatBC_All). If this is the case, why you make all that if, just use one line.
tip 1: you can see if your getElementById found the control by make teamporary an alert call like alert(document.getElementById("<%=Txt_MatBC_All.ClientID%>"));
tip 2: Right click on your browser and see the source code of your page to see what ids your control have take, to see if you actually is correct and the same with the javascript you use.
Try converting your JavaScript to square bracket notation. For example: document.forms[0].Txt_MatBC_All.focus();