How to set HTMLEditorExtender HTML from client side - c#

I cannot get this to work, here is code that I found in another thread but it is not working for me, I'm getting "set_content is not a function" :
$find("<%=Hee.ClientID%>").set_content("whatever");
Is this still valid?
I also tried to set value of the textbox it extends, tried setting InnerHtml of both,none worked.

I was going nuts for hours looking for a way to change the content and here's what I've come up with that works quite well:
This is the TextBox and Extender:
<asp:Textbox ID="replyBody" Height="450px" Width="892px" runat="server" TextMode ="MultiLine" />
<ajaxToolkit:HtmlEditorExtender ID="replyBody_HtmlEditorExtender" runat="server" Enabled="True" EnableSanitization="false" TargetControlID="replyBody">
</ajaxToolkit:HtmlEditorExtender>
Now this is the javascript that changed the value:
<script type = "text/javascript" >
function changeText(someString){
document.getElementById('ctl00_ContentPlaceHolder1_replyBody_HtmlEditorExtender_ExtenderContentEditable').innerHTML = someString;
}
</script>
This works like a charm. The above element ID is actually that of a div, however changing its contents updates the replyBody.Text property

$find("<%= Hee.ClientID %>")._editableDiv.innerHTML = "whatever";

Try this:
$("#<%=Hee.ClientID%>").html("whatever");

You could try this out:
var ctrl = $get("<%=Hee.ClientID%>").control;
ctrl.set_content("whatever");

Related

Update input type=text value or textbox control resize event

I have been having trouble updating the value for my input type=text or the texbox control text value with the jquery $(window).resize(function(){}); I know that the event fires because when i resize the browser an alert will appear. I also am using the functionality for something else.
It currently looks like this:
$(window).resize(function(){
if($(window).width()>1080){
var innerwidth = $(window).width()-170;
$("#div1").width(innerwidth);
}
I want to add this:
$(window).resize(function(){
if($(window).height()>500){
var innerheight = $(window).height();
$('input.hiddentest').val(innerheight);
}
I know that the issue lies with:
$('input.hiddentest').val(innerheight);
I have also tried this:
$('#texttest.ClientID').text(innerheight);
This is the input and the textbox below that I am using(note that the type used to be hidden, but i dont think that makes an issue and I wanted it to be visible for debugging purposes)
<input id="hiddentest" type="text" visible="true" name="hiddentest" onclick="test();" runat="server" value="1000" />
<asp:TextBox id="texttest" Visible="true" runat="server" Text="1000" />
Overall I have been looking for a way to dynamically update the values as the page resizes with the size of the page. My geuss is that i am not using the right thing to identify the id's. Thanks for taking the time to look at this and for any replies.
P.S. I am also open to the idea of using a javascript function instead but i can't even seem to get the function to fire for the resize event so it would require more help.
This is what i have so far:
window.onresize=Test();
function Test(){
var hdnfld= document.getElementById("texttest");
var testing = window.innerWidth;
alert(testing);
hdnfld.text= testing;
}
Use just ID of elements without dots (that actually represent the classes you don't have).
So use
$('#hiddentest').val(innerheight)
and
$('#texttest').val(innerheight)
Note that asp:TextBox renders as inptut type="text" so you still have to use .val() on it, not .text()
Hidden text box id is "hiddentest" so the code will be
$('#hiddentest').val(innerheight);
hiddentest is an id not a class in your case
Try,
$(window).resize(function(){
if($(window).height()>500){
var innerheight = $(window).height();
$('#hiddentest').val(innerheight);
}
});
<asp:TextBox id="texttest" Visible="true" runat="server" Text="1000" />
For the above asp.net textbox control, the ID changes dynamically when rendered (prepended with master and page information), id looks similar to main_ctrl100_texttest
var hdnfld= document.getElementById("texttest");, so this no longer holds good. Use a class instead.
<asp:TextBox id="texttest" Visible="true" runat="server" CssClass="texttest" Text="1000" />
var hdnfld = document.getElementsByClassName("texttest");
If you need more info on how to access .net controls using jquery, see here.

ASP.NET set hiddenfield a value in Javascript

I don't know how to set the value of a hiddenField in Javascript. Can somebody show me how to do this?
Javascript:
document.getElementById('hdntxtbxTaksit').value = "";
HTML:
<asp:HiddenField ID="hdntxtbxTaksit" runat="server" Value="" Visible="false"> </asp:HiddenField>
error : "Unable to get value of the property \'value\': object is null or undefined"
Prior to ASP.Net 4.0
ClientID
Get the client id generated in the page that uses Master page. As Master page is UserControl type, It will have its own Id and it treats the page as Child control and generates a different id with prefix like ctrl_.
This can be resolved by using <%= ControlName.ClientID %> in a page and can be assigned to any string or a javascript variables that can be referred later.
var myHidden=document.getElementById('<%= hdntxtbxTaksit.ClientID %>');
Asp.net server control id will be vary if you use Master page.
ASP.Net 4.0 +
ClientIDMode Property
Use this property to control how you want to generate the ID for you. For your case setting ClientIDMode="static" in page level will resolve the problem. The same thing can be applied at control level as well.
asp:HiddenField as:
<asp:HiddenField runat="server" ID="hfProduct" ClientIDMode="Static" />
js code:
$("#hfProduct").val("test")
and the code behind:
hfProduct.Value.ToString();
First you need to create the Hidden Field properly
<asp:HiddenField ID="hdntxtbxTaksit" runat="server"></asp:HiddenField>
Then you need to set value to the hidden field
If you aren't using Jquery you should use it:
document.getElementById("<%= hdntxtbxTaksit.ClientID %>").value = "test";
If you are using Jquery, this is how it should be:
$("#<%= hdntxtbxTaksit.ClientID %>").val("test");
document.getElementById('<%=hdntxtbxTaksit.ClientID%>').value
The id you set in server is the server id which is different from client id.
try this code:
$('hdntxtbxTaksit').val('test');
I suspect you need to use ClientID rather than the literal ID string in your JavaScript code, since you've marked the field as runat="server".
E.g., if your JavaScript code is in an aspx file (not a separate JavaScript file):
var val = document.getElementById('<%=hdntxtbxTaksit.ClientID%>').value;
If it's in a separate JavaScript file that isn't rendered by the ASP.Net stuff, you'll have to find it another way, such as by class.
My understanding is if you set controls.Visible = false during initial page load, it doesn't get rendered in the client response. My suggestion to solve your problem is
Don't use placeholder, judging from the scenario, you don't really need a placeholder, unless you need to dynamically add controls on the server side. Use div, without runat=server. You can always controls the visiblity of that div using css.
If you need to add controls dynamically later, use placeholder, but don't set visible = false. Placeholder won't have any display anyway, Set the visibility of that placeholder using css. Here's how to do it programmactically :
placeholderId.Attributes["style"] = "display:none";
Anyway, as other have stated, your problems occurs because once you set control.visible = false, it doesn't get rendered in the client response.
I will suggest you to use ClientID of HiddenField. first Register its client Id in any Javascript Variable from codebehind, then use it in clientside script. as:
.cs file code:
ClientScript.RegisterStartupScript(this.GetType(), "clientids", "var hdntxtbxTaksit=" + hdntxtbxTaksit.ClientID, true);
and then use following code in JS:
document.getElementById(hdntxtbxTaksit).value= "";
Try setting Javascript value as in document.getElementByName('hdntxtbxTaksit').value = '0';

Databound Value in href javascript link

I've trawled the net looking for the syntax to get this working and i'm hoping this is a quick fix else i'll go mad. Basically I have a nested repeater and the button below hides another nested repeater.
((location_details)((RepeaterItem)Container.Parent.Parent).DataItem).tbl_location.location_id evaluates perfectly well (3824 in the case i'm testing), but when I try to pass it so that its a string parameter for the javascript function it fails everytime.
<asp:Linkbutton ID="lb_showhide_oloc_gnotes" runat="server" Text="Expand/Close"
href='javascript:sltoggle('" + <%# ((location_details)((RepeaterItem)Container.Parent.Parent).DataItem).tbl_location.location_id %> +" '); return false;' />
Any ideas what i'm missing (I know the above syntax is wrong I must have changed it 100 times already but you get the idea).
thanks!
Have you tried asp:HyperLink and NavigateUrl?
I think asp:LinkButton renders to an anchor tag and its href attribute should be generated by ASP (so it results in a postback) and that's why it won't bind to it.
I can't test this right now so this might be wrong, but you don't need to concatenate the value of href together.
<asp:Linkbutton ID="lb_showhide_oloc_gnotes" runat="server" Text="Expand/Close"
href='javascript:sltoggle("<%# ((location_details)((RepeaterItem)Container.Parent.Parent).DataItem).tbl_location.location_id %>"); return false;' />

Adding empty string to RadComboBox

I have a webpage that has a Telerik RadComboBox on the page. One of the properties of this ComboBox is EmptyMessage, which fills the combobox with a message when an item is not selected. I am binding my combobox to a datasource at runtime and for some reason, it wipes this EmptyMessage away. Is there a way to keep my data items in tact and have the empty message there too? And default it to the empty message?
Seems like the accepted answer on Telerik says that you use client side script to prevent the text editing.
Telerik forum page
<telerik:Radcombobox ID="RadComboBox1" runat="server" AllowCustomText="True" EmptyMessage="-please select one-">
<Items>
<telerik:RadComboBoxItem runat="server" Text="Item1"></telerik:RadComboBoxItem>
<telerik:RadComboBoxItem runat="server" Text="Item2"></telerik:RadComboBoxItem>
</Items>
<script type="text/javascript">
function pageLoad()
{
var combo = $find("<%= RadComboBox1.ClientID %>");
var input = combo.get_inputDomElement();
input.onkeydown = onKeyDownHandler;
}
function onKeyDownHandler(e)
{
if (!e)
e = window.event;
e.returnValue = false;
if (e.preventDefault)
{
e.preventDefault();
}
}
</script>
RadComboBox1.Items.Insert(0, New RadComboBoxItem("Select a continent"))
This will add "Select a continent" as the first item in the combobox.
just put this
ComboBox.Text = String.Empty
In design time set EmptyMessage property.
<telerik:RadComboBox ID="ddlCategory" EmptyMessage="-Select-" runat="server" Width="120px" DropDownWidth="100px" AllowCustomText="true">
</telerik:RadComboBox>
In run time following code works for me.
ddlCategory.Text = "";
ddlCategory.ClearSelection();
Is 'AppendDataBoundItems' set to true?
Another option is to add the item to the combobox right after binding, and then setting it as selected.
I found the answer. For anyone curious or someone ever needs to do a similar things, you need to set the AllowCustomText property to True. This fixed my issue.

Ajax WaterMark Extender

Whenever I attempt to set text on the WaterMark Extender (which is on a control) dynamically I get an error saying the that TextBoxWatermarkExtendor missing required watermarktext property value for textboxWatermarkExtender1. The problem is I ONLY get this error some of the time on some computers. It seems to be a loading issue and not browser specific. Does anyone know where I can get some more info about this?
You may not be actually setting the property for watermarktext for the extender.
Take a look # this
<asp:TextBox ID="txtWatermark" runat="server" Width="200px"></asp:TextBox>
<cc1:TextBoxWatermarkExtender ID="txtWatermark_TextBoxWatermarkExtender" runat="server"
Enabled="True" TargetControlID="txtWatermark" WatermarkText="Type Your Search Here">
</cc1:TextBoxWatermarkExtender>
But it is strange that it works only in some computers. Make sure Javascript is turned on in the browsers.
This website has a great tutorial on Watermarked Textboxes + much more :)

Categories

Resources