how to assign asp.net label using JavaScript and Ajax - javascript

I am trying to assign a asp.net label using JavaScript and then whenever label text get changed to trigger Ajax UpdatePanal and update a grid based on text in the label.
This is what I have currently tried:
`function ChangeTeam(sPARENT_ID, sPARENT_NAME) {
alert("me1");
document.getElementById("Label4").value = "Text 123";
document.forms[0].submit();
}
function PopupHelp(page) {
var url = page;
window.open(url,'Select','width=600,height=600,status=0,resizable=1,scrollbars=1,toolbar=0,location=1');
}'
So what this is actually doing is: User click on a button under PAGE1 a new windows opens with PAGE2, PAGE2 contains checkboxes for user to select, once the user has made the selection on PAGE2 the selection ID is passed via JavaScript back to PAGE1 CHANAGETEAM() function where that function should populate a hidden label "Label4" and then based on that population of the label Ajax Panel should trigger and update a grid with the ID selected.
With the code I have above it gets back into CHANGETEAM() function and sends that alert ME1 but looks like nothing past that works. What am I doing wrong?
Thanks for your help.

The way .NET's controls are named on the page vs their IDs how they're rendered are different. If you inspect the source code of the rendered page, it's probably something along the lines of UpdatePanel1_Label4 instead of just Label4.
Besides hardcoding that name in, you can also get the rendered Id with the ClientId Property. So your code can look like
document.getElementById('<%= Label4.ClientID %>').value = "Text 123";

Related

Add multiple fields to webform on ASP.Net with just one button click

I have a webform in ASP.Net (Visual Studio). I have two buttons on the form, one button (button 1) submits the form and another button (button 2) would be used to add additional fields to the forms. I want to be able to click Button 2 to add all of the fields that are currently on the form with just one click. The user should also be able to add up to 20 such sets of additional fields. Thanks!
I am working with WebForms, but using VB.Net. I will try guide you through the steps, but you gotta use the syntax of c#.
Basically, all ASP:Buttons will submit the form. What you actually mean is, when you press button2, there should be a method handling button2. In that method, you can create dynamic controls. Example:
protected sub addFields() handles button2.click {
Dim field1 as type;
Dim field2 as type;
set properties of the fields;
//you need to place a placeholder on the aspx page
id_of_placeholder.controls.add(field1); -> so on
}
Now all fields are added, using viewstate you can store and retrieve how many times button2 has been clicked.
When a postback is done, all dynamically added fields are lost, because ASP.Net tracks only controls on the aspx page. You need to rebuild them on the page_load method (by knowing how many times the user clicked on button2, you can create a loop and add the fields back). Because the dynamically added controls are lost, the data they hold are lost too!! Use an ASP:HiddenField on the aspx page, so that a javascript can put user selected data into it.
Pseudo code:
js:
for each field {
//clientidmode = "static" can be used to make the id of hiddenfield predicatable
getHiddenField.text = getHiddenField.text + field.text + ",";
}
c#:
page_load method {
get viewstate containing button2 clicks;
string userdata = hiddenfield.text
for i = 0 to clicks - 1 {
add fields
//comma used as data seperator
for i = 0 to fieldscount {
//field(i) standing for each field
//substring, so we get the first data and assign it to field
field(i).data = userdata.substring(0, userdata.firstIndexOf(","));
//now delete the retrieved data, so we can loop
userdata.removeTheDataBeforeFirstComma;
}
}
}
After this, you should be able to dynamically add controls, display them and retrieve their data on postback.
When you reached this point, try to store the fields in Viewtate. This way, no need to use hiddenfields, just look if the field Viewtate exist, if so, add them.
Regards
Maheshvara

How to get all the Form elements, with values, in a popup window

I have one functionality to get the print of current page. So to prepare the content, I am showing everything on one popup up first then later a print popup and then print command.
Trying to do the same with below code.
$('#button').on('click',function() {
var popup = window.open("","mypopup","width=500,height=300");
var html = $("#form").html();
$(popup.document.body).html(html);
popup.print();
});
JSFiddle
Tried with clone() method as well but not working.
So the issue is, I am not getting the element's values in my popup.
Thanks
HI Use simple jquery line for each input field.
You can add a value attribute for your input fields.
I have changed your script a bit. Please refer it.
$('#button').on('click',function() {
var popup = window.open("","mypopup","width=500,height=300");
// I am setting the value attribute in the html . Do this for all fields
// with similar input fields you can have a jQuery('input').each(); loop
$('#name').attr('value',$('#name').val());
var html = $("#form").html();
$(popup.document.body).html(html);
popup.print();
});
Manually send the data from form through ajax call and store it in a local websql (browser)storage which can be retrived in the print preview dialog box

How to get the value of input control added through javascript

I have a button in my php view by which I can add textboxes to my page inside a form. But Whe I am getting the value of that control in my php controller the value is not there.
Is there any way by which we can get the value of dynamically added textboxes inside a POST form.
if you know the number of textbox you have, add the textbox before with a css style display:none; and display it in js on click event - for exemple with jquery
$('.yourclass').show();
it will act like a classic form
if you don't know the number you can have
you can send the form by js and get the value by something like that:
var myArray = [];
$('.yourclass').each(function() {
//unidimentionnal array exemple
myArray.push($(this).attr('myAttribut'));
});
console.log(myArray);
Seb

ASP.NET - using javascript to change text of LinkButton on every click

I have a LinkButton that essentially toggles a menu, "show/hide".
So I am doing the show/hide logic in a javascript method called onShowFiltersClick(), that is attached as an OnClientClick event.
But how do I reach (and change) the text value of the button? It is currently being set statically in the .cs file to "Show filters". But I want to toggle this on the client side. And the changes will probably have to persist across postbacks.
But as it stands now, I can't even retrieve the string "Show filters" from the .js, trying everything both sending the button's clientID as a parameter to the javascript and by accessing it through jQuery $ and the button's css class. I then try to view all sorts of parameters, including text, innertext, value and innerHTML.
So how do I access it?
edit: Neha requested a code snippet, so I'm including one of several I have tried:
function onShowFiltersClick() {
var filtersPanel = $('.filters-panel');
var displayStyle = filtersPanel.css('display');
filtersPanel.toggle('fast');
var showFiltersButton = $('.show-filters-button');
alert(showFiltersButton.text);
alert(showFiltersButton.innerText);
alert(showFiltersButton.innerHTML);
alert(showFiltersButton.value);
if(displayStyle === 'none')
$('.price-slider').repaint();
}
This produces the following:
function (a){if(f.isFunction(a))return this.each(function(b){var c=f(this);c.text(a.call(this,b,c.text()))});if(typeof a!="object"&&a!==b)return this.empty().append((this[0]&&this[0].ownerDocument||c).createTextNode(a));return f.text(this)}
followed by a bunch of undefined.

Get Element in div with JavaScript

I want to disable/enable a button with JavaScript. Because the JavaScript is called, after a Flash animation is rendered, the button exists at the time of the execution.
The button is in a hierarchy:
<html><body><form#form1><div#control><asp:Button#Export1>
I tried for hours to get a reference to that button, but nothing seems to work:
document.getElementById("Export1")
// and
document.getElementbyId("form1").getElementById("control").getElementById("Export1")
// and many more
How to get a reference to that button (in order to change btnref.disabled = true)?
Thanks a lot for your help!
Have you tried right-clicking in the document and selecting "view source" to see how that code actually renders? An asp:Button is a server control, that gets translated to an input field during render. During this, the ID of the field will not be exactly what you set it to in your aspx.
You can use Export1.ClientID at serverside to get the ID of the control.
If it's the only button in your div, this should work:
var btnref = document.getElementById("controls").getElementsByTagName("button")[0];
Usually the id of the button won't stay the same in the page source. Click on view source in the HTML and look for that tag to find the new id. You can then use that id in something like:
document.getElementbyId("Export1_some_unique_id")...

Categories