I am working with asp.net and i have some question here, any help will be great.I am trying to generate controls from Codebehind(C#) since the amount of data which is returned from server is uncertain, now my question is, is it possible to generate jquery datepicker control from C#? how to do that? show me some examples.
thank you.
Yes it is possible . You can have a common class which you want to use for Date Picker while creating your control add the class on the textbox on the server side.
txt.Attributes.Add("class", "myCal");
On the client side call this javascript
$(doucment).ready(function(){
$(".myCal").datepicker();
});
This will loop through all the textboxes with myCal as class and will it make it into datePicker
you may check here to learn and see the sample codes of datepickers. I hope it works for you.
Try this..
Codebehind:
TextBox txt = new TextBox();
txt.ID = "datepicker";
div1.Controls.Add(txt);
If u want for more number of textboxes u can use cssclass instead of id.
TextBox txt = new TextBox();
txt.cssclass = "date";
div1.Controls.Add(txt);
Aspx:
<script type="text/javascript">
$(function () {
$("#datepicker").datepicker();//or $(".date").datepicker(); for more number of textboxes
});
</script>
Add required scripts and styles in aspx as well.To know more see this link.
Related
I have written a code in which a textbox is dynamically added to a gridview cell. There is some default texts in the textbox. I want that when users will click on the textbox the default text will disappear and the user can then write anything on it only in number, i.e. the user will not be able to use letters or special characters.
Kindly let me know how to achieve this.
Code example
Gridview gv=new Gridview();
gv.DataSource=dt;
gv.DataBind();
Textbox t1 = new Textbox();
t1.Text="Outages if any(in mins)";
gv.Rows[0].Cells[0].Controls.Add(t1);
Need help after this, something like when user puts his cursor in the textbox , the default text will disappear , and if the user removes the cursor without writing anything , the default text will reappear. Also the default text should be a bit blurred
Thanks.
Try something like this
Textbox t1 = new Textbox();
t1.Attributes.Add("onclick", "if(this.value == 'default text') this.value = '';"
t1.Attributes.Add("onblur", "if(this.value == '') this.value = 'default text';" />
You could also use onfocus in case users use tab key
With this, using this.value, approach you don't need to know the client ID of the control.
Here is a post describing exactly what you are looking to do:
HowTo: including default text in a Textbox while enforcing server-side validation
The pertinent points are:
Adding javascript attribute to onfocus & and onblur:
txtName.Attributes.Add("onfocus","clearText()");
txtName.Attributes.Add("onblur","resetText()");
Adding the javascript to clear and repopulate the textbox:
function clearText() {
document.form1.txtName.value = ""
}
function resetText() {
if(document.form1.txtName.value == "")
document.form1.txtName.value = "(enter something here)"
You can do this. The easiest way is to use the ajaxControlToolkit. You can create controls dynamically. For example:
Dim mt As new TextBox
Dim newTest As New AjaxControlToolkit.TextBoxWatermarkExtender
With mt
.ID = "textBox1"
.TextMode = TextBoxMode.SingleLine
End With
With newTest
.ID = "TextBoxWatermarkExtender1"
.TargetControlID = mt.ClientID
.WatermarkText = "test"
End With
Then just add both controls to the gridview as you are doing with the textbox. If you are not using Ajax, you can add javascript to the control through codebehind but this is more difficult. Let me know if that is what you want to do and Ill add some code to show you how.
This should create a textbox control with an associated ajax TextBoxWaterMarkExtender.
I am new on Asp.net. I am using Javascript calender It use Input tag.if I use runat="server" so that I can get value on cs page then it does not display calender. How can I get calender value from input tag to .cs page
Simplest way:
Have a hidden field on your control.
Set its in javascript by using :
$('#<%=hdDate.ClientID %>').val("date value here");
and then you can access this hidden field in cs file.
create a hidden field as in your aspx page which should be runat="server".
then
On button click call javascript function say jsOnclikfun() and write this function as
<script type="text/javascript">
function jsOnclikfun() {
var dateInputtext = document.getElementById("Id Of input textbox which you are trying to make runat=server");
var hdDateValue = document.getElementById('<%= hiddenField_Id.ClientID %>');
hdDateValue.value = dateInputtext.value;
return true;
}
</script>
Now on server side where ever you need data get it from that hidden field as hiddenfieldID.Value.
Hope this helps.
I have the following requirement for creating a user profile in my application:
User should be able to enter multiple phone numbers/email addresses in his profile.
The screen looks somewhat like this:
- By default, on page load a single textbox for phone and email are shown.
- User can click a "+" button to add additional numbers/addresses.
- On clicking the "+" button we need to add another textbox just below the first one. User can add as many numbers/addresses as he wants. On submit, the server should collect all numbers/emails and save it in DB.
I tried using the Repeater control to do this. On page_load I bind the repeater to a "new arraylist" object of size 1. So, this renders fine - user sees a single textbox with no value in it.
When he clicks the "+" button, I ideally want to use javascript to create more textboxes with similar mark-up as the first.
My questions are these:
Can I render the new textboxes anyway using js? I notice that the HTML rendered by the repeater control is somewhat complex (names/ids) etc. and it might not be possible to correctly create those controls on client-side.
If there is a way to do #1, will the server understand that these additional inputs are items in the repeater control? Say, I want to get all the phone numbers that the user entered by iterating over Repeater.DataItems.
Conceptually, is my approach correct or is it wrong to use the Repeater for this? Would you suggest any other approach that might handle this requirement?
Coming from a Struts/JSP background, I am still struggling to get a grip on the .NET way of doing things - so any help would be appreciated.
The repeater control may be a bit of overkill for what you're trying to accomplish. It is mainly meant as a databound control for presenting rows of data.
What you can do is to dynamically create the boxes as part of the Page_Load event (C#):
TestInput.aspx :
<form id="form1" runat="server">
<asp:HiddenField ID="hdnAddInput" runat="server" />
<asp:Button ID="btnPlus" OnClientClick="setAdd()" Text="Plus" runat="server" />
<asp:PlaceHolder ID="phInputs" runat="server" />
</form>
<script type="text/javascript">
function setAdd() {
var add = document.getElementById('<%=hdnAddInput.ClientID%>');
add.value = '1';
return true;
}
</script>
TestInput.aspx.cs:
protected void Page_Load(object sender, EventArgs e)
{
if (ViewState["inputs"] == null)
ViewState["inputs"] = 1;
if (hdnAddInput.Value == "1")
{
ViewState["inputs"] = int.Parse(ViewState["inputs"].ToString()) + 1;
hdnAddInput.Value = "";
}
for (int loop = 0; loop < int.Parse(ViewState["inputs"].ToString()); loop++)
phInputs.Controls.Add(new TextBox() { ID = "phone" + loop });
}
I ended up using a PlaceHolder to dynamically add the text boxes and a HiddenField to flag when another TextBox needed to be added. Since the IDs were matching, it maintains the ViewState of the controls during each postback.
Welcome to the hairball that is dynamically-added controls in ASP.NET. It's not pretty but it can be done.
You cannot add new fields dynamically using javascript because the new field would have no representation in the server-side controls collection of the page.
Given that the requirements are that there is no limit to the number of addresses a user can add to the page, your only option is to do "traditional" dynamic ASP.NET controls. This means that you must handle the adding of the control server-side by new-ing a new object to represent the control:
private ArrayList _dynamicControls = new ArrayList();
public void Page_Init()
{
foreach (string c in _dynamicControls)
{
TextBox txtDynamicBox = new TextBox();
txtDynamicBox.ID = c;
Controls.Add(txtDynamicBox);
}
}
public void AddNewTextBox()
{
TextBox txtNewBox = new TextBox();
txtNewBox.ID = [uniqueID] // Give the textbox a unique name
Controls.Add(txtNewBox);
_dynamicControls.Add([uniqueID]);
}
You can see here that the object that backs each dynamically-added field has to be added back to the Controls collection of the Page on each postback. If you don't do this, data POSTed back from the field has nowhere to go.
If you want to user the repeater, I think the easiest way is to put the repeater in a ASP.Net AJAX update panel, add the extra textbox on the sever side.
There are definitely other way to implement this without using repeater, and it maybe much easier to add the textbox using js.
No, but you can create input elements similar to what TextBox controls would render.
No. ASP.NET protects itself from phony data posted to the server. You can't make the server code think that it created a TextBox earlier by just adding data that it would return.
The approach is wrong. You are trying to go a middle way that doesn't work. You have to go all the way in either direction. Either you make a postback and add the TextBox on the server side, or you do it completely on the client side and use the Request.Form collection to receive the data on the server side.
I want to hide the Next button on my ASP.NET Wizard control using JavaScript. Can anybody tell me if this is possible and post a javascript snippet on how to do this? Thanks!
2 options here...
TemplatedWizardStep - that way you create the buttons yourself and can then use either the control name or a css class on the button to turn it on & off with javascript or jQuery.
use StartNextButtonStyle to set a css class on your next button so you can grab the button with jQuery. Example of this one is below (I'm checking to see whether a checkbox is checked before enabling the button)
Wizard markup...
<asp:Wizard ... >
<StartNextButtonStyle CssClass="StandardButton StartNextButton" />
<WizardSteps>
<asp:WizardStep runat="server" ID="AgreementStep" StepType="Start">
<asp:CheckBox runat="server" ID="AcceptAgreement" Text="I agree to the agreement terms." TextAlign="Left" onclick='EnableNextButton();' CssClass="NormalTextBox AcceptedAgreement" />
</asp:WizardStep>
</WizardSteps>
</asp:Wizard>
Javascript (using jQuery) to enable/disable the next button:
<script type="text/javascript">
function EnableNextButton() {
var button = jQuery(".StartNextButton")
var checkBox = jQuery(".AcceptedAgreement input:checkbox");
if (checkBox.is(':checked'))
button.removeAttr("disabled");
else
button.attr("disabled", "disabled");
}
</script>
You should be able to use the answer from question #267191 to resolve your issue.
From the link (slightly modified):
var theControl = document.getElementById("btnNext");
theControl.style.display = "none";
// to show it again:
theControl.style.display = "";
Here is the server side code that will locate these controls. You can take it from there...
I ran into this problem when I was trying to use a wizard for a checkout sequence. I read a lot of these posts and they all have you jumping through a lot of hoops trying to find these buttons. They tell you that you have to add custom step templates, trace the control etc...
The good news is that it's not nearly that difficult. You don't need to use the custom templates.. Just drag a vanilla wizard control on the page, add your steps and this code works just fine. I am using this code on a production app of mine.
Dim btnNext As Button = Wizard1.FindControl("StepNavigationTemplateContainerID").FindControl("StepNextButton")
Dim btnPrevious As Button = Wizard1.FindControl("StepNavigationTemplateContainerID").FindControl("StepPreviousButton")
btnNext.Visible = False
btnPrevious.Visible = False
Here is an example for the final step...(Note the different name for the finish button.... (Using their naming convention I at first thought it would be FinishFinishButton..) lol
Dim btnFinish As Button = Wizard1.FindControl("FinishNavigationTemplateContainerID").FindControl("FinishButton")
Dim btnPrevious As Button = Wizard1.FindControl("FinishNavigationTemplateContainerID").FindControl("FinishPreviousButton")
btnFinish.Visible = FalsebtnPrevious.Visible = False
I can't imagine why you would want to disable the Next button on the 1st panel but here is the code for that one as well.
Dim btnNext As Button = Wizard1.FindControl("StartNavigationTemplateContainerID").FindControl("StartNextButton")
btnNext.Visible = False
Is it possible to pass the contents of a textbox or Listbox into the URL portion of the javascript code window.open(URL)? I have an asp.net listbox control that displays URL values. When ever an end user clicks on another listbox, the URL listbox provides the specific URL. I am trying to pass this URL into the above javascript code, but I do not know the correct syntax to do this. This code will execute as an onclick event.
For clarification, similar to typing “+ ListBox.Text.ToString() +” or ‘” & List.Text & “’” to add the content of a listbox into something else, such as a textbox. Is there specific syntax to do the same, but add the listbox.text into javascript?
Thank you,
DFM
Simply add a client-side onclick handler to your listbox as shown below:
<asp:ListBox id="ListBox1" runat="server" .....
onclick="openPopup(this)">
........
</asp:ListBox>
Then add the following javascript code:
<script type="text/javascript">
function openPopup(e){
window.open(e.value);
}
</script>
Sure, this should be pretty easy with jQuery. Obviously the URL generation could be reduced to a single statement, but should give you the general idea.
$(document).ready(function() {
$("your-element").click(function() {
var str = $("#listbox-id").val();
var url = "your-url.com/" + str;
window.open(url);
});
});