I have following html in my aspx page
<asp:Textbox id="myTextField" runat="server" cssclass="mycssclass" data-control-id="<%= search.ClientID %>"></asp:textbox>
<asp:Button ID="search" runat="server" Text="Search" />
the problem is "<%= search.ClientID %>" render as it is in the aspx file. i need to render the client id of control.
Thy this :
And call
this.DataBind(); in page_Load
(notice change in <%#)
<asp:Textbox id="myTextField" runat="server" cssclass="mycssclass" data-control-id="<%# search.ClientID %>"></asp:textbox>
Another (more convenient solution) is to use html elements which are not server side :
<input type='text' id="myTextField" runat="server" class="mycssclass" data-control-id="<%= search.ClientID %>" />
and then get it via Request.Form[...] ( via name attribute)
If you want to know what the client ID will be, then search and read about the setting "ClientIDMode" - setting it to Static, for example, will set the client-side ID in the DOM equal to the server side ID that you set. Just make sure have only one instance of that Control on your page otherwise you have more than one control with that ID, and that won't fly. If that control will be in a repeater, item template or any other "repeating" control, then add an index counter for the loop to dynamically alter then ID slightly.
Related
On MarkUp in my aspx page form I have these two TextBox :
<asp:TextBox ID="Mtl" runat="server" ReadOnly="true" Enabled="false"></asp:TextBox>
<asp:TextBox ID="ps" runat="server"></asp:TextBox>
The HTML view for these two TextBox is :
<input name="Mtl" type="text" value="901" readonly="readonly" id="Mtl" disabled="disabled" />
<input name="ps" type="text" id="ps" />
Now I need insert next to the TextBox with id ps the HyperLink where passed in querystring the value of TextBox with id Mtl, the value is 901.
I need pass this value for working in another aspx page.
I have tried this solution but the HyperLink is not clikable :
<asp:HyperLink ID="HlLink" runat="server"
NavigateUrl='<%# String.Format("~/box.aspx?v={0}&e={1}&l={2}", "y", "IC", HttpUtility.UrlEncode(Eval("Mtl").ToString())) %>'
ImageUrl="~/Images/edit_icon.gif" Target="_blank" Text="Mtl"></asp:HyperLink>
In this aspx page I don't have GridView, maybe it does not work for this reason ?
How to do resolve this ?
Please help me, thank you so much in advance.
Yes you are correct since your control is not inside a gridview (or any databoundcontrol for that matter) that's why it will not work.
Actually, <%# %> is called data bind expressions and they are evaluated for data bound controls only. For your HyperLink control to work with this code nugget you will have to explicitly call the DataBind method on that control like this:-
protected void Page_Load(object sender, EventArgs e)
{
HlLink.DataBind();
}
You can bind a jQuery 'Change' event on your textbox. And in this event you can set correct navigation url by picking up the value from the textbox and appending it in appropriate place in your query string. Its a fairly easy solution. If you don't know how to do it I can provide you a sample.
I have a that would result in some uncompilable code in the designer.cs file:
<div id="tabs-1-2-3"></div>
If I add a runat="server" property, my designer file won't compile for obvious reasons.
Is there any way to add an extra property that wil be used internally as the id?
If you don't have runat="server" then you can access it through the old school way.
<input type="text" id="text1" name="text1" />
then from server side use
Request["text1"]
for div:
The best way to do this would be some form of ajax, since your client side script would be able to read that contents and pass it to a server side method
Access in code behind isn't possiable without runat="server" attributes
Use an <asp:Panel /> which will turn into a <div> in the HTML page.
<asp:HiddenField ID="HiddenField1" runat="server" />
<asp:TextBox ID="Textbox1" runat="server" Visible = "false"></asp:TextBox>
How ASP.Net will render asp:HiddenField and asp:TextBox with visibility property as false?
In context of you html
<asp:HiddenField ID="HiddenField1" runat="server" />
<asp:TextBox ID="Textbox1" runat="server" Visible = "false"></asp:TextBox>
text-box will not be render on the browser.
But the hidden field will be rendered.
The control visibility which you set from the server side code will not be render on the browser. You you want to use the use css display:none
It will render both the same as
<input id="_controlId" type="hidden" value="" name="_controlId">
You can open your page in browser and look at page source.
If you want server not to render your controls at all put them into PlaceHolder and set property Visible = "false"
<asp:PlaceHolder ID="PlaceHolder1" runat="server" Visible = "false">
<asp:TextBox ID="Textbox1" runat="server" ></asp:TextBox>
</asp:PlaceHolder>
You can find this out yourself. Run your .aspx page and click View Source on the page.
The hidden field will be included in the markup, but you won't be able to visually see it on the page.
The TextBox is set as invisible from the server side. It won't turn up at all unless you change the Visible property to true.
The term "render" refers to ASP.NET's act of creating the HTML for the .aspx Page,When you set Visible = false to a control, it is not rendered. That means there is no HTML representation of that control sent to the page. Set the style only.
You can set the style as display: none from server side code like this:
FromDate.Style.Add(HtmlTextWriterStyle.Display, "none")
This way the element is still there for JavaScript to manipulate.
This code doesn't display the value, I don't know why?
I have server control:
<asp:TextBox ID="txtTest" runat="server" Visible="false" TextMode="MultiLine"
Rows="3" Columns="23" CssClass="white-scroll" />
in javascript function:
var eventText = document.getElementById('<%=txtTest.ClientID%>').value;
alert (eventText);
I enter text then click on button that call the javascript function, but the alert box doesn't display the entered text.
EDIT: when I initialize the text with Text="some text", it is displayed in alert, I want to enter text in client side and get the value of it in the Javascript function.
Thanks
Using label or textbox visible set false so it can access the value in JavaScript
Sol
1)
Make a div and set style="display:none;" so label is not display at UI(browser) but value can access in JavaScript.
This is because you server Control is called "txtTest" not "txtEventDescription"
change your javascript function to :
var eventText = document.getElementById('<%=txtTest.ClientID%>').value;
alert (eventText);
EDIT: ok, I see you've now changed the post to show the code and renamed the js control, so above is no longer relevant (for those who are confused by my answer) :-)
The problem is the Visible="false" - this control will not render into the client and will therefore not be accessible via javascript (as the HTML element does not exist client side)
So, hide the element using CSS and then call alert on it. Sample snippet
CSS
.hide-element {
display: none;
}
HTML Markup
<asp:TextBox ID="txtTest" runat="server"
Columns="23"
CssClass="white-scroll hide-element"
Rows="3"
TextMode="MultiLine"/>
JavaScript
var eventText = document.getElementById('<%=txtTest.ClientID%>').value;
alert (eventText);
This way you will definitely get an alert.
You alert is empty because you have not set the property Text for your asp:Textbox
Make it Visible="true" to your textbox and than test.
<asp:TextBox ID="txtTest" runat="server" TextMode="MultiLine"
Rows="3" Columns="23" CssClass="white-scroll" />
if "txtTest" textbox has visible="false" in that case its not render on html code on client machine and if it hasn't on client's html code then how javascript calls this textbox. Because when javascript search this textbox by its id it doesn't find and it gives an error.
you can assign any other custom attribute to the control i.e.
<asp:TextBox ID="txtTest" runat="server" Visible="false" TextMode="MultiLine"
Rows="3" Columns="23" CssClass="white-scroll"
clientID="myClientID" />
and then access control using jquery like
var txtVal = $('textbox[clientID=myClientID]').val();
hope it helps.
I'm trying to select an element from my webpage...
I have inserted a control into my page and i need to set some values an element inside the control at pageload from c# code.. The thing is, as soon as I insert the control into the page... A prefix is appended to the id name... Because of that new name, my css definition won't be appended...
Is there any way to access this element from C# without the need to make it an Id?
Edit: To clarify what Im trying to do here. Im trying to make a generic control, which gets a width and height set to it's parameters. I need to set this manually to the element by adding a style attribute. I can't make the element an id, because this will stop the possibility of making it generic.
This is whats inside of the control... the fact is, I need the imageRotatorDiv to be a class instead of an id. Otherwise i can't use multiple image rotators on one page.
But how can I select a class in a page from c# code? Is it possible?
<div id="imageRotatorDiv" runat="server">
<div class="imageRotator">
<asp:Repeater ID="rprImages" runat="server">
<ItemTemplate>
<asp:Image ID="imgItem" runat="server" />
</ItemTemplate>
</asp:Repeater>
</div>
</div>
you can define your style to a class name instead of id.
<asp:TextBox ID="MyText" CssClass="someclass" runat="server" />
html output
<input type="text" id="Something_MyText" class="someclass" />
css
.someclass { border:solid 1px red; }
In JQuery :
$("div[id$=MyDiv]").addClass("myDiv")
And you just need to define the myDiv CSS class. Or, to modify directly the style :
$("div[id$=MyDiv]").css("font-size", "14px");
JQuery details