I am not javascript html php expert but I would like to study I just wanted to ask for advice Is it possible to make the user can enter single or Multiple input of email in textbox separated by ; using javascript just like in outlook,yahoo,email?
<!DOCTYPE html>
<html>
<body>
<form action="/action_page.php">
email <input type="text" name="FirstName" value="Mickey"><br>
</form>
</body>
</html>
Just Enter the text and click in the text box emails are separated
<html lang="en">
<head>
<title>Jquery - input tags plugin example</title>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery-tagsinput/1.3.6/jquery.tagsinput.min.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-tagsinput/1.3.6/jquery.tagsinput.min.js"></script>
</head>
<body style="background: #337AB7">
<div style="width: 500px; margin: 0px auto;">
<h2 style="font-family:cursive;">Jquery - input tags plugin example</h2>
<input name="tags" id="input-tags" style="width:500px !important" />
</div>
<script type="text/javascript">
$('#input-tags').tagsInput();
</script>
</body>
</html>
Related
<script type="text/javascript" src="jquery/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="dependsOn-1.0.0.min.js"></script>
<script>
$(document).ready(function) {
$('#basicTest .subject').dependsOn({
'#basicTest input[type="checkbox"]': {
checked: true
}
});
});
</script
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form id="basicTest">
<label>
<input type="checkbox"> Check me
</label>
<input type="text" class="subject">
</form>
</body>
</html>
I am actually trying to implement the basic example which is after click on the "check me" a input box gets displayed. By using the depends on plugin is is not working. These are the files. I placed the script in between the html and head tags. Any suggestions are welcome!
Hi i have this html code:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="/style.css"/>
<link rel="icon" href="">
<title>Submit</title>
</head>
<body>
<script>
function show_alert() {
alert("Animes score is: ");
}
</script>
<div class=střed>
<form>
<div id="one"><input style="width: 500px" type="text" name="url" value="Enter myanimelist URL" onfocus="if (this.value=='Enter myanimelist URL') this.value='';"/></div>
<div id="two"><input type="image" onclick="show_alert();" name="submit" src="/Button1.png" border="0" alt="Submit" />
</div>
</form>
</div>
</body>
</html>
Now i want to get from user's url (for example: https://myanimelist.net/anime/5114/Fullmetal_Alchemist__Brotherhood) the anime's score from page's html (this part: <span itemprop="ratingValue">9.26</span> - so in this case it would be 9.26) and show it in alert box (doesn't need to be alert box thought, just somehow show it to user). Thanks for any help.
I've searched on google but didn't find answer.
Here is jsfiddle so you can see it yourself: http://jsfiddle.net/ohk6ho8a/
When you type text into the line and submit 1 div moves under another.
Any idea how to fix this?
HTML file: - other files at jsFiddle (it's pain to copy paste code here)
<!DOCTYPE html>
<html>
<head>
<title>Text Game</title>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="gameScript.js"></script>
<link rel="stylesheet" type="text/css" href="style.css" media="screen" />
</head>
<body>
<p id="help" style="display:none;">This is help</p>
<div id="divWrapper">
<div id="console">
<div id="placeholder"></div>
</div>
<div id="menu">
<div id="placeholder2"></div>
</div>
</div>
<form onsubmit="return false;" autocomplete="off">
<center><input type="text" id="command_line" autofocus="autofocus" size="50"></input><center>
<center><input type="submit" id="submit" size="50" ></input><center>
</form>
</body>
</html>
On your #console and #menu remove inline-block and change them both to float:left;
updated fiddle: http://jsfiddle.net/ohk6ho8a/1/
float:left;
instead of
display:inline-block;
You should float the two divs (float: left for both) and apply a clearfix style on the parent.
I'm trying to do the following:
- I have 2 pages (page 1 with input fields & page 2 where the entered input should display)
- I need to get all that was typed from the first input field, and put the results inside the tag "content" of the 2nd page.
1º Page Input :
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Page 1 - Input</title>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.8.3.js'></script>
<script>
function submit() {
var code = $('textarea[name=message]').val(); //Input Code HTML
$("#iframeId").contents().find("body").html($("<div class='content'></div>").append(code));
}
</script>
</head>
<body>
<h2>Input</h2>
<textarea name="message" id="input" rows="10" cols="100"></textarea>
<input type="button" value="Submit" onclick="submit();" />
<iframe id="iframeId" name="iframeId" src="layout.html"></iframe>
<div id="test">
Text
</div>
</body>
</html>
2º Page Layout :
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Page 2 - Layout</title>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.8.3.js'></script>
</head>
<body>
<div class="header"></div>
<div class="content"></div>
<div class="sidebar"></div>
<div class="foot"></div>
</body>
</html>
THANKS!
This should work if both files are having the same origin:
<script>
function submit() {
var code = $('textarea[name=message]').val(); //Input Code HTML
$('#iframeId').contents().find('.content').text(code);
}
</script>
You were almost there :)
UPDATE:
To insert on submit:
<script type="text/javascript">
$('#iframeId').load(function(){
$('input[type="button"]').on('click',function(){
$('#iframeId').contents().find('.content').html($('textarea[name=message]').val());
});
});
</script>
To insert on type:
<script type="text/javascript">
$('#iframeId').load(function(){
$('textarea[name=message]').on('input',function(){
$('#iframeId').contents().find('.content').html($(this).val());
});
});
</script>
The following part of code produces this result in Firefox and Chrome
<html>
<title>Dojo Example</title>
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6.0/dojo/dojo.xd.js"
djConfig="parseOnLoad: true">
</script>
<script type="text/javascript">
dojo.require("dojo.parser");
dojo.require("dijit.form.ValidationTextBox")
</script>
<label for="firstName"> First Name: </label>
<input type="text" id="firstName"
dojoType="dijit.form.ValidationTextBox"
promptMessage="Enter first name:"
invalidMessage="First Name is required"
/>
</html>
An extra text box is produced with text "X" on it. I have no idea how to fix it and why does this happen. Anyone can help?
You need to add a valid dijit theme to the body tag of your html document, in addition to including a to the css stylesheet of the theme you want to use.
for example:
<html>
<head>
<title>Dojo Example</title>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dijit/themes/claro/claro.css">
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6.0/dojo/dojo.xd.js"
djConfig="parseOnLoad: true">
</script>
<script type="text/javascript">
dojo.require("dojo.parser");
dojo.require("dijit.form.ValidationTextBox")
</script>
</head>
<body class="claro">
<label for="firstName"> First Name: </label>
<input type="text" id="firstName"
dojoType="dijit.form.ValidationTextBox"
promptMessage="Enter first name:"
invalidMessage="First Name is required"
/>
</body>
</html>