Is there anyway to create RadTextbox dynamically from client side like the ordinary html textbox like this.
$(document).ready(function(){
$("#btnCreateTextBox1").click(function(){
$("", {type: "text", "class": "numeric" }).appendTo('#container');
});
});
Here it is an client side control it is creating but what about for the server control like RadTextbox or asp.net textbox control.
There really isn't a way to take a server control such as the RadTextBox and dynamically create it on the client. Taking a look at your specific example the reason this works is because, as you mentioned, you are creating a regular HTML element and not a complex control with potentially several HTML elements and server-side API.
You could of course instantiate the RadTextBox dynamically on the server-side or just use the markup approach for the non-dynamic way. You can then interact with the control via it's client-side objects as mentioned in this documentation article.
Related
i tried to dynamicaly load GridView on the existing page from server. However, when I get the html from the server and insert it into the element, grid appears, but some actions are not available on it (for example drag and drop on columns, filters and so on). Moreover, i have a callback on init event and controls init event, but they dont invoke. Recently, i have loaded gridview with full page and all was good. On support center i found that i need to use ASPx.Evt.DispatchEvent(window, "load"); after insert gridview in my page, but there isnt any explanation about this. Currently, after i have added this piece of code and most of functionality works well and client side events fired, but some are still broken, for example GridView.PerformCallback();. What else i need to do to init controls on my gridview?
Origin code about 'load' event in devexpress support center
https://www.devexpress.com/Support/Center/Question/Details/T489045/how-to-determine-if-scripts-are-loaded
The aforementioned ticket refers to the MVC Extensions product, not the WebForms.
In the meantime, why do you need to render the HTML and add it to the DOM and initialize manually? It is not a good practice for the server-side controls (i.e., when the client-side counterpart should be properly processed).
If you need to add the DevExpress ASP.NET WebForms control dynamically, consider using, for example, ASPxCallbackPanel.
I am facing issues when I tried to add same custom control twice in the same page. The issue is because instance of one control is caling the java script of the other. Added to that I am using ajax popup extender where in I have popup divs with in that control itself.
Now it is leading to java script errors because it is geting confused among the popup div ids and scripts etc.
Please help me.
Take one step further in taking care about client-side IDs generated uniquely for the tags inside each instance of your custom control.
This can be easily fixed by adding runat="server" attributes to the tags which you want to have unique client side IDs when rendered to the browser. Then you should use this kind of code in JS:
document.getElementById("<%= control.ClientID %>");
As about tags which you don't want to mark using runat attribute, you can assign them their IDs uniquely on the server-side manually in each instance of the custom control.
I hope this helps!
There's no automatic fix for this. If a custom control is going to be used more than once on a page, you have to design it to be aware of this. In particular, you'll probably need to refer to generated elements using their generated id:
var ele = document.getElementById("<%= serverSideControl.ClientID %>");
Javascript emitted by the control will have to also emit the appropriate ID's.
And so on.
I am creating a web user control for a simple poll. I am currently registering it on the page and then referencing it via tagprefix.
The form for the poll is in basic html (no server controls) and is in the front-end of the web control. How can I change the look of the user control depending on the settings passed into it? Is this possible without using server controls?
Update
Can I change the html layout of a user control? If so could someone post some examples. Please note I do not use asp.net form controls, so none of that please :)
You might be able to also use jQuery to replace existing css setting in your code. Create properties on for your user control, and then pass settings in the classes. Then use jQuery to replace them. This however requires jQuery to be linked to your page (or within your control) and you'd have to write the CSS classes out to the jQuery code (using server controls, but you could use the literal control so there's no excess code).
Personally I'd go with the option of using server controls instead of straight up HTML, you'd get alot more flexibility, and then passing through the settings would be pretty straightforward, put something like this in your controls backend code:
Private _TextBoxCssClass As String
Public Property TextBoxCssClass() As String
Get
Return _TextBoxCssClass
End Get
Set(ByVal value As String)
_TextBoxCssClass = value
txtBox1.CssClass = value
txtBox2.CssClass = value
End Set
End Property
You most likely want to have a property or event in the control that changes the css. It may end up best to add some server controls or javascript / jquery to make it easier.
If its only the styles you want to change, then you can expose a property to set the style attribuites of the respective control inside your User Control. If you want to control the whole HTML layout of the control then Custom Control is the viable option.
I have a Repeater control that I bind server-side. It repeats a series of divs, and does so with no problem. I have some buttons that I use to sort the repeater (newest, highest ranked, random) and this works the way it should.
I would like to improve my user experience by making the buttons sort the divs using Ajax/jQuery somehow so that there is no page postback and the user does not lose his/her spot on the page.
Is there a way to use jQuery to access server-side code like this, or use Ajax to re-bind a server-side control?
Thanks... if I need to list more details, please let me know!
EDIT I'm aware of UpdatePanels, but I would prefer not to use them if I don't have to.
Have you considered moving the Repeater's functionality to the client-side?
Doing it that way, functionality like paging and sorting is not very difficult to add. In fact, you can lean on the framework pretty heavily by using ADO.NET data services as the service layer.
It's relatively easy.
Move your repeater to a separate custom control, let's say MyControl. Now repeater in your page becomes uc1:MyControl.
Wrap MyControl into a div:
<div id="mydiv">
<uc1:MyControl ID="MyControl1" runat="server" />
</div>
Create a new page, pgMyControl.aspx, that contains MyControl only.
On your main page, add jQuery handlers to your sort links. Use load method to dynamically replace div contents:
$('#link_sort_random').click(function()
{
$("#mydiv").load("pgMyControl.aspx&sort=random");
}
Use QueryStringParameter in datasource inside MyControl to change order. Or use Request.QueryString in code-behind file.
Using an updatePanel or a jquery Ajax postback are the same thing essentially. Both will ask your code to fetch the new query, then make your control render itself, and then feed the HTML back to the client as a partial page render, and then insert the content in place of the old content in the same DOM location.
It is considerably harder to make JQuery and ASP.NET talk to each other this way due to the nature of web controls and their lifecycle that determines when they render. An updatePanel knows how to call all this, maintain proper viewstate and return the result to the correct location.
In this case, don't make things any harder on yourself, use the updatePanel unless you have some very specific reason not to.
EDIT: If you're having JQuery issues with update panels it is probably due to the fact that new DOM nodes being created. JQuery has the live event to handle this. It will notice when new DOM elements are created and match them against your selector even after the document ready.
Maybe it's an OT, but you can consider to change the way you bind even the client and the server control, using XSLT transformation instead od the classics server controls.
You can find an example here (sorry, it's in italian...).
I've built a ascx control and I would like to be able to keep adding new instances of it using JavaScript instead of having to do a AJAX callback. Is this possible? I am basically building a web form for a query control and should clause X be filled in, I want to generate a control for the next clause below. I would like to learn how to do this without doing a callback.
Thanks
ASCX are server side user controls and, to my knowledge, can only be loaded by a server event. This can be accomplished through a full page postback or using UpdatePanels and ASP.net AJAX.
If you don't want to use these options and stick with a full JavaScript solution, you're looking at probably doing DOM manipulation and dynamically adding straight HTML.
If the ASCX controls don't change their appearance and all you're doing is showing and hiding them, one last alternative could be to load all of them into DIV tags that have their display style set to none. Then when the user clicks on a checkbox or whatever, you can use JavaScript to show that DIV tag containing the next control. This is how many JavaScript tab setups work.