I modify a code like that, for click a checkbox.
Such as,
Is there a any problem about button name or id. I could see just name and class. Is this a problem for work?
<html>
<head>
</head>
<body>
<button>Giris</button>
</body>
<script type="text/javascript">
var chkA5 = "button" class=formCheckBox type=checkbox value=ON name=chkA5
window.onload = function() {
document.getElementById("chkA5").checked = true
});
}
</script>
</html>
I copied all chechbox button properties on web site (F12 + Slect Element + click to check box) and pasted in my script. But I really confused, when I write a code in script, describing works for new things which I add or create. On this web site which I want to click a chechbox on has already buttons and text/check box. How can I create a connect with each other my scrips and web site.
In brief; I couldn't connect my scripts to web site's button and because of that I couldn't do any operation. Am I right?
How can I solve this problem? On picture which I shared, there are some code marked in a red square. This code works for desciribe some element in my scribs?
When we use document.get.ElementById().checked =true, on web site's element properties's has not a id? It has name and class.
Problem 1: getElementById should be getElementByName
Based on your screenshot, the input item you are trying to reference is:
<input name="chkA5" class="formCheckBox" type="checkbox" value="ON"></input>
and you are trying to getElementById()
document.getElementById("chkA5").checked = true
However, there is no id declared, so you will have to get the item by the name, using getElementByName():
document.getElementsByName("chkA5")[0].checked = true;
Problem 2: Your javascript has errors
This line will cause your script block fail:
var chkA5 = "button" class=formCheckBox type=checkbox value=ON name=chkA5
If you require a complete code sample, here is an example:
<html>
<head>
</head>
<body>
<input name="chkA5" class="formCheckBox" type="checkbox" value="ON"></input>
</body>
<script>
(function() {
document.getElementsByName("chkA5")[0].checked = true;
})();
</script>
</html>
Note: Make sure that the script block is at the end of your html, like in your example code provided.
Related
I'm a beginner at coding but I couldn't find the answer on the internet.
I have a browser game with a donate button from Paypal. After someone has done a donation, he goes to the thankyou-page.
I want to give the people who have donated a little golden crown (an svg) in the game, and I tried to do that with this when pressing the "go back to homepage and get a crown" button on the thankyou-page:
document.getElementById('crown').style.display = "inherit";
(the display according to the css was "none")
But the thing is: It doesn't work (it must be because I have 2 different .html files with 2 different .js files, because when I use one .js file for both of the .html files it gives many errors of things that are not working).
The main thing is: I want to give something visually back to the people who donated. Is there a simple solution to do this?
index.html where the crown is:
<svg id="crown">
Some svg coordinates that form a crown
</svg>
style.css where it is invisible:
#crown {
display: none;
}
A button in index.html has a Paypal link where you can donate. When you have donated, you land on thankyou.html with this button on it:
<button id="getCrown" type="button"
onclick="window.location.href='/index.html'; getCrown();">Give me that crown!</button>
That should let the Javascript in thankyou.js make the crown visible with this:
document.getElementById('crown').style.display = "inherit";
But it doesn't. It gives an error:
Uncaught TypeError: Cannot read property 'style' of null
at getCrown (thankyou.js:5)
at HTMLButtonElement.onclick (thankyou.html:32)
So you give your button a onclick="set_crown()" attribute.
This calls the set_crown() javascript function:
function set_crown(){
localStorage.setItem('crown', 'visible');
};
then you check in your index html if he got this key with the right value with javascript like this:
if (localStorage.getItem('crown') === 'visible'){
document.getElementById('crown').style.display = 'inherit';
};
Note that you can do the same with sessionStorage. The difference is that localStorage data will stay there untill the user clears his browser or you delete it with javascript while sessionStorage will clear itself when the session ends aka the browser closes.
Here again something to read ;) localStorage info
Here the two little example pages:
index.html :
<!DOCTYPE html>
<html>
<head><meta charset="utf-8"></head>
<body onload="check_crown()">
<div id="crown" style="display:none">
<p>I am a Crown :)</p>
</div>
<button id="donate" type="button"
onclick="window.location.href='thankyou.html';">
Donate
</button>
<script type="text/javascript">
function check_crown(){
if (localStorage.getItem('crown') === 'visible'){
document.getElementById('crown').style.display = 'inherit';
};
};
</script>
</body>
</html>
thankyou.html :
<!DOCTYPE html>
<html>
<head><meta charset="utf-8"></head>
<body>
<button id="getCrown" type="button"
onclick="window.location.href='index.html'; set_crown();">
Give me that crown!
</button>
<script type="text/javascript">
function set_crown(){
localStorage.setItem('crown', 'visible');
};
</script>
</body>
</html>
Simply run the index with your favorite browser, Hope that helps :)
It appears you have two different document objects i.e. the thankyou.html & index.html. So as part of your event handling (in context of thankyou document) you're trying to alter the state of another document (index.html). This is not something you want to do.
I have tried to create a fiddle out of your example and it works fine with a single document model. https://jsfiddle.net/8y4jdapt/20/
See if it helps.
Otherwise, why don't you pass on a URL parameter to index.html like window.location.href='/index.html?showCrown=true And use this parameter somwhere in the context of index.html to decide whether to render the crown or not.
Assume I have an iframe in my HTML webpage that contains a part of my HTML data. It has an input for a search text box. I want, when I write something inside the input, using onkeypress event, I can show the data in the span.
How can I do this?
I read many different suggestions but none of them worked correctly for me!
Note that pages are at same domain but I don't have access to the iframe page code!
Can anyone help me writing it?
Here is the simplified code of what I need:
$(document).ready(function() {
$('#iframeDoc').ready(function(){
$(this).contents().on('keypress', function(event) {
// add pressed keys to span });
});
$('#iframeDoc').attr("src","JavaScript:'iframe content'");
});
Main page HTML:
<html>
<body>
<iframe id="iframeDoc" src="iframepage.html"></iframe>
</body>
</html>
iframepage html:
<html>
<body>
<input type="text" />
<span id="result"></span>
</body>
</html>
A generic function to capture any keyup events within the iframe, e.g.
$(document.getElementById('frame-id').contentWindow.document).keyup(function(e){
//code here
});
Separately you can access elements in iframes with code like (note that I added an ID to your input element):
$('#iframe').contents().find('#element_id');
So putting them together, could you not do something like:
$(document.getElementById('frame-id').contentWindow.document).keyup(function(e){
if($('#iframe').contents().find('#element_id').is(":focus")){
//code here
}
});
Fiddle of what I think is working example for your code:
https://jsfiddle.net/42j45kmn/7/
What I'm attempting to do is add an HTML button that will trigger as really simple javascript function.
Essentially onclick, I want to see if a field contains a value of 0.00 - if so remove that value. Or, if the field does not contain data, add in the value of 0.00 so it should alternate between those two values.
<html>
<head>
</head>
<body>
<button onclick="ReCalc">Re-Calculate Balance</button>
<script>
function ReCalc() {
var BalanceWriteOff = Xrm.Page.getAttribute("jucy_balancewriteoff").getValue();
if ((BalanceWriteOff) ==null)
Xrm.Page.getAttribute("balancewriteoff").setValue("0");
Xrm.Page.data.entity.save();
if ((BalanceWriteOff) =="0")
Xrm.Page.getAttribute("jucy_balancewriteoff").setValue(null);
Xrm.Page.data.entity.save();
return;
}
</script>
</body>
</html>
When I try to run this on the form where the HTML element has been placed. Nothing is happening. I've thrown in some break points at the var and both if statements and I'm not getting a break when I'm triggering the onclick event.
I'm kind of stumped here. If anyone has any insights for me that would be awesome
Oops! In your onclick attribute you forgot to invoke the method.
To fix this, simply change onclick="ReCalc" to onclick="ReCalc()".
Here's a code pen to show you it works now - https://codepen.io/trentrand/pen/Jyomgr
To access CRM form fields from an HTML web resource, add this script to the HTML:
<script src="ClientGlobalContext.js.aspx" type="text/javascript"></script>
and prepend "parent" to the Xrm.Page object:
parent.Xrm.Page.getAttribute("jucy_balancewriteoff").getValue();
I feel a bit silly asking this question, since most of the questions people ask on here are way beyond my level as a programmer, but at least I know I'm in good hands as far as asking goes. I used to know how to make simple vbscript and javascript programs, but I'm a bit rusty. I'm trying to refresh myself, and despite repeated google/other searches, can't recall how to make it so that when a button is clicked, a msgbox appears. Also, I'd like to know how to modify the .value attribute of a textbox. I'm attempting this in vbscript for now, but I'll try javascript if anyone knows a way to do it in that instead. My ultimate goal is a text based type game where you can click buttons labeled, "north,south,west,east", and make it like an rpg. The textbox would display the current room description.
Here's the code I have so far, which isn't displaying the msgbox.
<html>
<title>Explor-o-Rama!</title>
<body>
<form name = frmMain>
<textarea name = "txtDisp" rows = "10" cols = "50"></textarea><br>
<input type = "button" name = cmdTest value = "test">
</form>
<script language = "vbscript">
sub cmdTest_OnClick
msgbox "test"
end sub
<script>
</body>
</html>
You have:
msgbox "test"
The correct command is:
MsgBox("test")
OR
X=MsgBox("test")
This SHOULD DO IT.
also, <html><body><script language=vbscript>msgbox "" </script></body></html> not works.
but this code works OK:
<html><body><script>alert('Test');</script></body></html>
<html>
<body>
<script>
function test()
{
alert('Test');
}
</script>
<input type = 'button'; onclick='test()'>
</body>
</html>
Probably, it's a IE internal bug.
I have a situation with sample code as follows:
<html>
<head>
<title>Untitled Document</title>
</head>
<body>
<p>
<h1>The header</h1>
<div>
matter ia always matter matter ia <strong>bold matter</strong> matter matter <em>italics matter</em>matter ia <em><strong>bold italics matter</strong></em>lways matter
</div>
</p>
</body>
</html>
I am just trying to retrieve the specific tags like body->p->div->em->strong when I click on "bold italics matter" using jQuery. Is there any standard method to retrieve as per the click event?
If you wan to get the tag name of the element which is clicked, then you can use:
$('*').click(function(e) {
e.stopPropagation();
console.log($(this).prop('tagName'));
});
Fiddle Demo
I'm not completely sure about what you are trying to accomplish. If you are trying to retrieve the tag itself that the text is contained in, i would recommend that you put a <span> tag in around the the text in question and do an onclick="function()" or simply put the onclick right on the <strong> tag.
As far the the JQuery/Javascript goes, if you want to retrieve the content, it looks like
var foo = document.getElementById.innerHTMl("id");
However, this requires you to have an id in your tags which is probably the best, if not
'standard' method of retrieving the content that is within the tag.
After reading your comments, i am editing this post:
The best way to get the parent elements is to use the JQUery .parent() function. I'd imagine that you would just recursively state something like this:
var foo = $("nameofelement").parent();
I hope this is more of what your looking for.
Thanks for contributing everybody. At last I made it myself with the following code.
$(document.body).click(function(e){
var Tags=[], Target=e.target, stat_msg="";
Tags.push(Target.tagName);
while($(Target).parent().get(0).tagName!=="BODY")
{
Tags.push($(Target).parent().get(0).tagName);
Target=$(Target).parent();
}
Tags.push("BODY");
for(i=Tags.length;i>0;i--)
stat_msg=stat_msg+Tags[i-1]+" ";
alert(stat_msg);
});