Sending java script variable value as part of PostBackUrl query string - javascript

I need to send a parameter value into a query string of a PostBackUrl method
within asp button.
The value I need is already being captured within a java script function shown below.
How do I send the value in hiddId as part of URL ? The below method isn't working. Can someone please help ?
<script language="javascript" type = "text/javascript">
function btn_Selected() {
var hiddId = null;
$('#<%=GridView1.ClientID %>').find('input[type=radio]:checked').each(function () {
hiddId = $(this).closest('tr').find('input[type = "hidden"]').val();
});
}
<asp:Button ID="Btn_Update" runat="server" Text="Update" PostBackUrl="Screen_Edit.aspx?CustID='<%=hiddId%>'"

Instead of a post-back, just redirect using JavaScript.
function btn_Selected() {
var hiddId = null;
$('#<%=GridView1.ClientID %>').find('input[type=radio]:checked').each(function () {
hiddId = $(this).closest('tr').find('input[type = "hidden"]').val();
});
window.location.href = "Screen_Edit.aspx?CustID='" + hiddId + "'"
}

If you look at the HTML source of the page, the button will have an javascript onclick event that looks something like this javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ctl00$mainContentPane$Btn_Update", "", false, "", "Screen_Edit.aspx?CustID=", false, false))
All we have to do is find a way to insert your variable after ?CustID=.
You can replace the onclick value of the button with the .attr() function of jQuery and do a search and replace to insert your variable.
<script type="text/javascript">
$(document).ready(function () {
var hiddId = $(this).closest('tr').find('input[type = "hidden"]').val();
$("#<%=Btn_Update.ClientID %>").attr("onclick", $("#<%=Btn_Update.ClientID %>").attr("onclick").replace("?CustID=", "?CustID=" + hiddId));
});
</script>

Related

Obtain variable between tag and append to URL

I have a webpage that was developed by someone else. I want to take the variable that they are displaying on when the page loads from the following tag <h3 id="TAGS"></h3> and append that to a this example URL http://someurl.com/<variable>.
I'm not a JavaScript person so any help would be appreciated.
I tried the following which did not work
var myURL = $('#TAGS').innerHTML
<input type="button" value="Download" onclick="window.location.href=\'http://someurl.com/' + myURL + '\'"/>
JAVASCRIPT + jQuery:
Create a global variable like var downloadURL = "" and make a function in jQuery:
$( document ).ready(function() {
var myURL = $("#TAGS").html();
downloadURL = "http://someurl.com/" + myURL;
});
and then you make your button like this:
<input type="button" value="Download" onclick="download()"/>
having the method download do whatever you want:
function download() {
if(downloadURL!="") {
window.location.href=downloadURL;
}
else {
//you don't have a value set
}
downloadURL="";
}
JAVASCRIPT: Create a global variable like var downloadURL = "" and make a function to load on page load:
window.onload = function() {
var myURL = document.getElementById("TAGS").innerHTML;
downloadURL = "http://someurl.com/" + myURL;
});
and then you make your button like this:
<input type="button" value="Download" onclick="download()"/>
having the method download do whatever you want:
function download() {
if(downloadURL!="") {
window.location=downloadURL;
}
else {
//you don't have a value set
}
downloadURL="";
}
You're trying to use Jquery library with '$' sign. if you didn't install that library simply don't use it. instead, you can use pure browser JavaScript function.
var myURL = document.getElementById("TAGS").innerHTML;
myURL will be whatever inside the HTML element.
for example: <h3 id="TAGS">test</h3>
myURL = test
Try this code:
var myURL = $('#TAGS').val()
But don't forget include jQuery to you code.

Redirect url if checkboxes are selected

I have some problem with redirecting urls after checkboxes are selected. I am using document.location for this, but this doesn´t work in my code. I'm trying to fix it, but without success.
This is the part of my code which doesn't work:
function objednat() {
var adress = "";
if (document.getelementbyid('BoxtarifVolani1').checked == true) {
adress += "#tarifVolani1";
}
window.location = 'http://www.investcon.webinpage.cz/cz/objednat-tarif-dobijeci-cislo/' + adresa;
}
I want to redirect this to a form, which will be filled with the selected values. I don't know why, but this document.location doesn't work in the code.
This is the part of the code I use in the formula for grabbing the hash from the url.
<script type="text/javascript">
if(window.location.hash) {
//set the value as a variable, and remove the #
var hash_value = window.location.hash.replace('#', '');
if (tarifVolani1 == true) {
document.getelementbyid('BoxtarifVolani1").checked = true;}
....
</script>
What am I doing wrong?
Whatever you have done is right, except, the function name is wrong case:
Change getelementbyid to getElementById.
Change adresa to adress.
Code:
function objednat() {
var adress = "";
if (document.getElementById('BoxtarifVolani1').checked == true) {
adress += "#tarifVolani1";
}
window.location = 'http://www.investcon.webinpage.cz/cz/objednat-tarif-dobijeci-cislo/' + adress;
}
jQuery way of doing it
function objednat() {
var adress = "";
if ($('#BoxtarifVolani1').is(':checked')) {
adress += "#tarifVolani1";
}
window.location = 'http://www.investcon.webinpage.cz/cz/objednat-tarif-dobijeci-cislo/'+adress;
}
For your ref: jQuery :checked Selector

Passing an URL parameter to a href link using Javascript

I have the following code working to pass a URL parameter to a form tag:
<script type="text/javascript">
function getQueryVariable(variable) {
var query = window.location.search.substring(1);
var vars = query.split("&");
for (var i=0;i<vars.length;i++) {
var pair = vars[i].split("=");
if (pair[0] == variable) {
return pair[1];
}
}
}
function onLoad() {
var value = getQueryVariable("ID");
var e = document.getElementById('your-field');
e.value = value;
}
</script>
And...
<body onload="onLoad()">
<!-- your form and hidden field goes here -->
<input type="hidden" name="your-field" id="your-field" />
How can I pass the same value to an HTML link so that the end result would be:
<a href="http://www.mysite.com?source=[ID]" >
Where [ID] is the whatever piece of code that is needed to add the parameter to the link?
Thanks in advance.
You should give an id to you link, like this:
<a id="YOUR_ID" href="#" >
And then you have two ways to solve the problem, use pure Javascript or use jQuery:
IF you use jquery you can use your onLoad function and inside inject the following:
var url = "http://www.mysite.com?source=" + value;
$("#YOUR_ID").attr("href",url)
OR using pure javascript:
var url = "http://www.mysite.com?source=" + value;
var element = document.getElementById('YOUR_ID');
element.setAttribute("href",url)
Change the function onload to this:
function onLoad() {
var value = getQueryVariable("ID");
var e = document.getElementById('your-field');
e.value = value;
var url = "http://www.mysite.com?source=" + value;
var element = document.getElementById('YOUR_<A>_ELEMENT_ID');
element.setAttribute("href",url)
}
I'm using the piece of code that Joao Almeida suggested so his example using jQuery works good too.
Good Luck!

using the method onclick () to trigger a function that opens a window it grabs from the clicked button

<script language="JavaScript">
function goThere()
{
var the_url = window.document.form.button.value;
var good_url = fixURL(the_url);
var new_window = window.open(good_url,"new_window","menubar,resizeable");
}
function fixURL(the_url)
{
var the_first_seven = the_url.substring(0,7);
the_first_seven = the_first_seven.toLowerCase();
if (the_first_seven != 'http://')
{
the_url = "http://" + the_url;
}
return the_url;
}
</script>
</head>
<body>
<form name="the_form" onclick="goThere()"; return false;">
<input type="button" name="the_url" class="broadGroups" onClick="goThere()" value="http://en.wikipedia.org/wiki/Category:Sports"></input>
<input type="button" name="the_url" class="broadGroups" onclick="goThere()" value="http://en.wikipedia.org/wiki/Category:Film"></input>
</form>
</body>
</html>
So this code may be totally messed up, but here is what I am trying to do.
There are two buttons inside the tag. I want each to use the method onsubmit to trigger the function goThere(). How do I set it up so that the_url is set to a value that I pull from the button tag. I also want to be able to put non-url text on the button itself while allowing it to call goThere () through the method call onsubmit.
In the end it should just take the url, make sure it starts with http:// (in this case it doesnt matter because the user isn't inputting the url, but I'd like to keep it in for other purposes later on) and open it in a new window with a menubar and the resizable property.
Sorry for the long post. Any help would be greatly appreciated.
Pass in this in your goThere call. This will bring in the clicked element to your goThere function. Then you access the attributes for the clicked button.
http://jsfiddle.net/wJMgb/
onClick="goThere(this)"
function goThere(elem) {
var the_url = elem.value;
var good_url = fixURL(the_url);
var new_window = window.open(good_url, "new_window", "menubar,resizeable");
}
function fixURL(the_url) {
var the_first_seven = the_url.substring(0, 7);
the_first_seven = the_first_seven.toLowerCase();
if (the_first_seven != 'http://') {
the_url = "http://" + the_url;
}
return the_url;
}

change the value of parameter in URL

I'm trying to make a javascript function to change the value of a parameter in the URL with the value inputed in a text box, with no luck. That's because I'm note a code designer but a graph one.
this is the URL where I need to change the "City" parameter:
http://server/ad_new_customer.php?&city=&uri=http://server/adauga_exp.php
I am generating data in the input text box through a MySQL query with jQuery like this:
<input type='text' id='city' name='city' style="width:190px; align:left;" value="<?php echo $city; ?>" /> </td>
<script type="text/javascript">
//change the value of parameter in the URL function
function changeURI(key, value) {
var query = document.location.search.substring(1);
var query_q = query.split("?");
var vars = query_q[1].split("&");
for (var i = 0; i < vars.length; i++) {
var pair = vars[i].split("=");
if (pair[0] == key) {
vars[i] = pair[0] + "=" + value;
}
}
return vars.join("&");
}
//jQuery making the auto-suggestion query for the input ID
$().ready(function() {
$("#city").autocomplete("core/exp_city.php", {
width: 340,
matchContains: true,
selectFirst: false
}).return(changeURI("city", this.value}));
});
</script>
How can I make it change the value the parameter on selected value?
Please advise, again, a humble designer.
Thank you!
L.E.
I have made an workaround, changed the changeURI() function with this one:
function changeURI(key, value)
{
key = escape(key); value = escape(value);
var kvp = document.location.search.substr(1).split('&');
var i=kvp.length; var x; while(i--)
{
x = kvp[i].split('=');
if (x[0]==key)
{
x[1] = value;
kvp[i] = x.join('=');
break;
}
}
if(i<0) {
kvp[kvp.length] = [key,value].join('=');
}else{
//this will reload the page, it's likely better to store this until finished
document.location.search = kvp.join('&');
}
}
Found on StackOverflow and call it from the jQuery query with the $.result() function:
<script type="text/javascript">
$().ready(function() {
$("#city").autocomplete("core/exp_city.php", {
width: 340,
matchContains: true,
selectFirst: false
}).result(function() {changeURI("city",this.value)});
});
</script>
What error are you getting? are you getting any javascript error? Also, try changing your code to some thing like
url = url.replace(new RegExp("city=", 'g'), "city="+value).
Also, The URL written in the question should not have & before city parameter as the first parameter starts with a ?, so the URL should be :
http://server/ad_new_customer.php?city=&uri=http://server/adauga_exp.php
Check if that was the issue.
In your example, document.location.search.substring(1) is already getting rid of the question mark: it should return &city=&uri=http://server/adauga_exp.php. Then doing a split on "?" and trying to take the second array element should return undefined, because there are no longer any "?" characters. Skip straight to var vars = query.split("&") at that point, and the rest looks okay to me.

Categories