I have a text box called txtName on my form.
In my page I know I need to place the code in my HEAD tag like so......
<script type='text/javascript' language="javascript">
document.FormName.txtName.value = "Robert";
</script>
But I cant seem to set a value to my textbox txtName with the above code......
That's because your code get executed before the DOM is created.
You can do something like this
window.onload = function() {
document.forms['FormName'].elements['txtName'].value = "Robert";
}
or use JQuery
$(function() {
document.forms['FormName'].elements['txtName'].value = "Robert";
// for a shorter syntax use id
$('#txtNameId').val("Robert");
}
Your script executed before page loaded. Use onload event
Can you set the id on the textbox? Then you can use getElementByID("textboxid"); Selecting by id is faster.
UPDATE:
You need to ensure that the DOM has been load so that your script can locate the element you want to update. One way is:
<body>
<form>
<input id="txtName" name="txtaaaName" type="text" value="notnow"/>
</form>
<script type="text/javascript">
function LoadTextBox(){
document.getElementById("txtName").value = "ready to go";
}
LoadTextBox();
</script>
</body>
An alternative could be where you use onload in the body tag:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script type="text/javascript">
function LoadTextBox(){
document.getElementById("txtName").value = "ready to go";
}
</script>
</head>
<body onload="LoadTextBox">
<form>
<input id="txtName" name="txtaaaName" type="text" value="notnow"/>
</form>
</body>
Related
The the only action I got to somewhat work was this one, but this shows the popup when the "suspend/hold" button is on the page, not when it's pressed. I want the popup to appear when it's pressed, I've tried the ones mentioned in the documentation, like 'woocommerce_subscription_status_on-hold' and a ton of others, I don't know if I'm using the wrong action or something else in my code is wrong. Here is the snippet, thank you so much for your time.
add_action('wcs_can_user_put_subscription_on_hold','suspend_survey_popup');
function suspend_survey_popup () {
echo '<html lang="en"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <title>My typeform</title> <style>*{margin:0;padding:0;} html,body,#wrapper{width:100%;height:100%;} iframe{border-radius:0 !important;}</style> </head> <body> <div id="wrapper" data-tf-widget="D4JE8Xxp" data-tf-inline-on-mobile data-tf-medium="snippet" ></div> <script src="//embed.typeform.com/next/embed.js"></script> </body> </html>';
}
Bind a jQuery click event to the suspend button click event.
add_action('woocommerce_after_my_account', 'myaccount_on_suspend_subsciption');
add_action('woocommerce_subscription_details_after_subscription_table', 'myaccount_on_suspend_subsciption');
function myaccount_on_suspend_subsciption() {
?>
<script>
jQuery(document).ready(function($) {
$("td.subscription-actions a.suspend, table.shop_table.subscription_details a.suspend").on("click", function(e) {
var confirmCancel = confirm("Are you sure you want to suspend this subscription?");
if (!confirmCancel) {
e.preventDefault()
}
})
})
</script>
<?php
}
I have tried to set the value on the Autocomplete control and set the focus from java script. The value is set to the field but the list of predictions are not displayed when page is loaded.How can I also show the prediction list with the initial search string set on the field when page is loaded.Please see the below the code.
Please note as soon as user click on the control(Manually) the dropdown is displayed.
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
</head>
<body>
<input type="text" id="address" style="width: 500px;"></input>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&libraries=places&language=en-AU"></script>
<script>
$(document).ready(function() {
var autocomplete = new google.maps.places.Autocomplete($("#address")[0], {});
google.maps.event.addListener(autocomplete, 'place_changed', function() {
var place = autocomplete.getPlace();
});
//$("#address").val('George Street');
$("#address").focus();
</script>
</body>
</html>
I have found the solution for this. I have hooked the code to set the value and set the focus on the control in the DOM Event 'load' as below
google.maps.event.addDomListener(window, 'load', function() {
$("#address").val("George Street");
$("#address").focus();
});
I am trying to have a session timeout for an iframe window to automatically close after 20 minutes without warning is this possible?
it is the code for your aim
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<script type="text/javascript">
function CreateIframe(){
var iframe=document.createElement('iframe');
iframe.setAttribute("src","http://www.disney.com");
iframe.setAttribute("id","target");
iframe.setAttribute("height","200");
iframe.setAttribute("width","200");
document.body.appendChild(iframe);
setTimeout(function(){
var frame = document.getElementById("target");
if(frame!=undefined && frame !=null){
frame.parentNode.removeChild(frame);
}
else{
console.log('Iframe not created yet');
}},20000);}
</script>
</head>
<body>
<input type="button" value="click me" onclick="CreateIframe()" >
</body>
</html>
I would like to track googleplusone clicks without using google analytics. Is there any functionality available for this? I tried to google it but to no avail.
UPDATE: I tried this but the callback is not fired?
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"> </script>
<script type="text/javascript">
function helloWorld(plusone) { alert('+1 Triggered, State=' + plusone.state); }
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<g:plusone callback="helloWorld"></g:plusone>
</div>
</form>
</body>
</html>
You set the callback attribute on the +1 tag to a javascript function.
This function is called after the user clicks the +1 button. The callback function must be in the global namespace and may accept a single parameter, which will be a JSON object with the following structure:
{
"href": target URL,
"state": "on"|"off"
}
The state property is set to "on" for a +1, and "off" for the removal of a +1.
I want make datetimepicker in my project. Using jquery how it is possible?
I have one text box, div and calendar. Once i focus on textbox, the calendar div gets fadein. Some way what i want to do is this: Once i click on calender the selected value should show in textbox and calender should hide. How?
Here is the code so far.
$(document).ready(function() {
$(".txtDateTime").focus(function () {
$(".CalenderDiv").fadeIn("slow");
});
$(".UserCalender").click(function () {
$(".CalenderDiv").fadeout("slow");
$(".txtDateTime").val("fdgfg");
// ================??????
});
});
This code once i click textbox calender will show. But in the case of Calendar click it is not working? Why....Please Help me....
Seems like you are re-inventing the datepicker widget from jQuery UI. Is that correct? Why not just use what works?
full code:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Simple DatePicker example</title>
<link rel="stylesheet" type="text/css"
href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/smoothness/jquery-ui.css"></link>
<script type="text/javascript"
src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'></script>
<script type="text/javascript"
src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js'></script>
<script type="text/javascript" language='javascript'>
$(document).ready( function (){
$('.pick-date').datepicker({clickInput:true});
});
</script>
</head>
<body>
<h1>jQuery UI datepicker example</h1>
<div class="inputDiv">
<p>Click in the box to select a date:</p>
<input id='b1' class='pick-date' value=''/>
</div>
</body>
</html>
demo: http://jsbin.com/ewime
You should checkout jQUeryUI's Datepicker widget: http://jqueryui.com/demos/datepicker/
The widget has got the functionality you are looking for.. and you do not have to create your own calendar.