i have a Ajax Control toolkit water mark extender for a search box which is there in a master page . Based on certain condition ,i would like to change this value from the child page which inherits from this master page .I want to do it in client side with jquery /javascript . Any ideas??
You can create a javascript function that change the watermark, andd just call it from your child page
function setWatermarkText(text)
{
var watermark = $get('<%= WatermarkExtender.ClientID %>');
watermark.set_Text("John Smith");
}
Related
In my application i create a navigation menu dynamically. When I click on the anchor tags that refer to various content page I want to capture the anchor tags' text and display it in a div in the content page.
How can i possibly achieve this?
Can it be done through HttpHandlers? or do I need to look into something else??? Please help.
Assuming that you want your div to look different or be positioned in different places for each content page and all you want to display in that div is the page URL you can solve this using a simple script that you can add in your master page:
document.onload = function()
{
var titleDiv = document.getElementById("titleDiv");
titleDiv.innerText = window.url;
}
The only constraint is that your div must have the same id in all the content pages.
I want to make a label invisible in child page which is defined in master page.
Is there a way to do that?
((Label)Master.FindControl("mylbl")).Visible = false;
put this in page load of the child page , mylbl refers to the ID of the label
it might be Master.Page.FindControl .... now that I think of it, it's been a while , but that's how you do it
You should use javascript. Normally in this situation, you would reference your label using
(assuming your label's ID is my_label_id)
document.GetElementById('<%= my_label_id.ClientId %>')
. . . or if you are using jquery . . .
$('#<%= my_label_id.ClientId %>')
However, AFAIK you cannot use clientid to reference a server-side control located on the master page from a content page. So I would either give the control a unique class name using the asp.net label attribute CssClass="myLabelClass" or retrieve the client Id by building the page, viewing the source, and finding the client ID. Steps for this can be found here:
How to use javascript in content page, asp.net
Once you correctly reference the item, simply change the "display" style attribute to "none" as seen below.
Using jQuery and assuming your CssClass name is myLabelClass:
$('.myLabelClass').css('display','none');
If you wanted this to occur on page load you could do the following:
$(function(){
$('.myLabelClass').css('display','none');
});
Here is the context:
I am building a .aspx page that allows the user to administrate some xml documents we have on our server. The page content is loaded using AJAX, so buttons and forms are dynamically added to the document.
If I had static buttons that I was creating within the .aspx page before it loads on the client's machine, I could attach an event to it very easily. However, I'm dynamically adding and removing buttons and forms on the fly, using jQuery.
Here is a simplified example:
In the following jsFiddle, I'm pretending that the html document contains the following script:
<script language="C#" type="text/C#" runat="server">
void SaveAllChanges(Object sender, EventArgs e)
{
Button clickedButton = (Button)sender;
clickedButton.Text = "foobar";
}
</script>
And that I have a javascript file that contains the following:
$('button.buttonGenerator').click(function() {
$('.buttonContainer').append(
'<button onclick="SaveAllChanges">' +
'Save All Changes!' +
'</button>'
);
});
Obviously the buttons I am creating can not run the function SaveAllChanges with the way it is now. I added the onclick attribute to show what I needed to happen, in a pseudo-code kind of style.
How can I make it so that dynamically added buttons can run the C# method I have defined within the script tag at the top of the document?
Here is the jsfiddle: http://jsfiddle.net/2XwRJ/
Thanks.
You can give all buttons that must save changes a common class (e.g. class="ajaxButton") and have one jQuery method that responds to click events on elements matching that class (use live so that updates to the DOM are reflected).
$("button.ajaxButton").live("click", function(){
// Perform your Ajax callback to run server-side code
});
What you need to do is use something like ..
$(document).ready(function() {
$('button.buttonGenerator').click(function() {
$('.buttonContainer').append(
'<button id="#dynamicCommentButton" onclick="SaveAllChanges">' +
'Save All Changes!' +
'</button>'
);
});
$(document).on('click', '#dynamicCommentButton', function() {
alert($(this).attr('id'));
});
});
You are not going to be able to add the buttons like you have it there as this code here is just adding it as an HTML DOM element and the onclick attribute will be the on the client element. As a result clicking the button will try fire a SaveAllChanges javascript function
$('.buttonContainer').append(
'<button onclick="SaveAllChanges">' +
'Save All Changes!' +
'</button>'
);
What would be best would be to create that SaveAllChanges function in javascript and then you can handle it from there. Two of the ways I see you being able to do this are:
Have a http endpoint setup (script service, web api or just posting to a page) that you call using Ajax from your javascript. You can then pass through any needed arguments.
You could have a hidden element and hidden button on the page so that when the javascript is called it populates any arguments you need and then clicks the hidden button and posts the page back.
Personally I would choose the first approach from a user experience stand point as the page will not be posting back each time. I have used something similar to the second approach and it works fine but just feels very clunky.
How can I update a textbox or label (specfically an asp.net control) text property from the code in the silverlight control?
Suggested solution:
I suppose that you could try to do it in two steps:
write a javascript function that updates a control based on a given parameter, let's name it updateControl:
<script type="text/javascript">
function updateControl(newValue)
{
//update your control here with newValue parameter with javascript
...
}
</script>
in your Silverlight application (in the place you want to invoke the control value change) you should write:
HtmlPage.Window.Invoke("updateControl", "this is a new value")
Another solution for page update only:
If you just need to refresh the page to get the value from other place, you can write in your Silverlight code:
HtmlPage.Document.Submit()
In the postback, you could get this data and show it in the control.
References and useful resources:
ScriptObject.Invoke Method : http://msdn.microsoft.com/en-us/library/system.windows.browser.scriptobject.invoke%28v=vs.95%29.aspx
Walkthrough: Calling JavaScript from Managed Code: http://msdn.microsoft.com/en-us/library/cc221359%28v=vs.95%29.aspx
Silverlight and JavaScript interop basics: http://pietschsoft.com/post/2008/06/Silverlight-and-JavaScript-Interop-Basics.aspx
How to set the value of a form element using Javascript: http://www.javascript-coder.com/javascript-form/javascript-form-value.phtml
You can do it calling javascript function from silverligt.
Shortly it looks like this:
HtmlPage.Window.Invoke("globalJSMethod", stringParam);
Note that javascript method must be accessable from window - window.globalJSMethod(...)
Check this walkthrough to see in details how to do this.
I have a label and a div called "menu" that is currently invisible. I want that when the user clicks the label. It will make the div visible. I thought of doing it through javascript, how do I make a control visible through javascript?
First, if you want to access controls on the client-side, they must be rendered as html. When you use Control.Visible it won't be rendered on the client and is only accessible on the serverside. Therefore you have to use CSS to toggle it's visibility on the clientside.
show the div:
document.getElementById('menu').style.display = 'inherit';
You could hide it with:
document.getElementById('menu').style.display = 'none';
You should keep in mind that the id of serverside-controls could change when it's inside of an other NamingContainer than the page(f.e. in a GridView or UserControl). So you should use Control.ClientID to get the correct ID that'll be generated from ASP.Net:
So this is better:
document.getElementById('<%= menu.ClientID %>').style.display = 'none';
In ASP.Net 4.0 it's possible to customize the ClientID. For further informations:
http://www.thereforesystems.com/working-with-client-id-in-asp-net-4/
http://msdn.microsoft.com/en-us/library/system.web.ui.control.clientid.aspx