I've been trying to push through a PHP variable $getUserID to a JavaScript function that doesn't seem to accept it. I've been looking through a lot of answers on stackoverflow as well as the internet in general but I haven't found a solution yet.
Code:
PHP :
<!-- Comments Form -->
<div class="well">
<h4>Leave a Comment:</h4>
<form role="form" method="post">
<div class="form-group">
<textarea class="form-control" rows="3" id="commentInput"></textarea>
</div>
<button type="submit" onclick="checkComment(<?php echo $getUserID ?>)" class="btn btn-primary">Submit</button>
</form>
</div>
JavaScript :
var comment = {
commentText: "",
userID: ""
};
function setValues() {
comment.commentText = document.getElementById("commentInput").value;
}
function validateComment(commentText) {
if(!(commentText === "" || commentText.length < 1))
return true;
}
function checkComment(userID) {
setValues();
alert(validateComment(comment.commentText));
comment.userID = userID;
alert(comment.userID);
alert(comment.commentText);
}
What I'm trying to do, for testing purposes, is to print alert messages to see if every variable is received. No alert messages pop up when I hit the submit button. I believe it is an error due to the php variable. Is anyone able to spot the error?
<button type="submit" onclick="checkComment(<?php echo $getUserID ?>)" class="btn btn-primary">Submit</button>
I wasn't using single quotations after "checkComment(".
Fixed code:
<button type="submit" onclick="checkComment(<?php echo $getUserID ?>')" class="btn btn-primary">Submit</button>
Related
I trying to write a booking appointments for my website. But i have something need to help from you.
this is my HTML for field to input:
<div class="form-group second_box">
<form id="submit" style="display:inline-block" method="post">
<label for="submit" class="control-label">
<?= lang('submit') ?> *</label>
<input type="number" name='otp' id="otp" class="required form-control" placeholder="write your code here" required="required" >
<span id="otp_error" class="field_error"></span>
</div>
this is my HTML button:
<button type="button" id="button-next-3" class="btn button-next btn-primary" onsubmit="submit_otp()"
data-step_index="3"<?= lang('next') ?>
<span class="glyphicon glyphicon-forward"></span>
</button>
and this is my Jacascript from another file:
function submit_otp(){
$('#wizard-frame-3 .has-error').removeClass('has-error');
$('#wizard-frame-3 label.text-danger').removeClass('text-danger');
var otp=jQuery('#otp').val();
jQuery.ajax({
url:'../../../Code_Verification/check_otp.php',
type:'post',
data:'otp='+otp,
success:function(result){
if(result=='yesFalse'){
jQuery('#otp_error').html('Please enter your valid code');
}
if(result=='yesTrue'){
jQuery('#otp').html('Your code is correct');
}
if(result=='not_exist'){
jQuery('#otp_error').html('Please enter valid otp');
}
}
});
}
--> I using php in check_otp.php to connect with my database to comparing the value return. if the input in the second_box equal with the value i saved in the database that's mean the customer can go to next step. if they give input wrong with the value in database that's mean they cannot continue. but i don't know how to give it's logic together.
and this is the next button call in javascript file:
$('.button-next').click(function (){
if ($(this).attr('data-step_index') === '3') {
if (!_validateCustomerForm()) {
return; // Validation failed, do not continue.
}
}
--> thanks all for help.
Since you're using jQuery, you can try
$("#button-next-3").attr("disabled", true);
Use .attr() to set disable attribute
Usage $(selector).attr("disabled", true)
In your case : $("#button-next-3").attr("disabled", true)
function myButton() {
document.getElementById("myBtn").disabled = true;
}
<html>
<body>
<button id="myBtn">My Button</button>
<p>Click the button below to disable the button above.</p>
<button onclick="myButton()">Try it</button>
</body>
</html>
function checkNullSearch(e) {
if ($('#searchInput').val() === "") {
$('#searchInput').attr("value", "null");
}
}
script.js
<form role="form" id="form-arya">
<div class="form-group">
<div class="panel panel-primary searchPanel">
<div class="input col-sm-12">
<input type="text" class="form-control" id="searchInput"
name="searchInput"
aria-describedby="Not Null"
placeholder="Search"
required>
</div>
<div class="inputAndButtons">
<div class="standartSearch">
<button class="btn btn-arya btn-success" type="submit" name="ara"
value="standart">
<i class="glyphicon glyphicon-search" aria-hidden="true" onclick="checkNullSearch(this)"></i>
Search
</button>
</div>
</div>
</div>
</div>
</form>
xxx.html
Sometimes it works, sometimes it doesn't work
I want to on the input control to do. I want return "null" if input is empty value's
Change your button code like below:-
<button class="btn btn-arya btn-success" type="submit" name="ara" value="standart" onclick="checkNullSearch(this)"><i class="glyphicon glyphicon-search" aria-hidden="true"></i>Search</button>
And use $.trim() in your jQuery code
function checkNullSearch(e) {
if ($.trim($('#searchInput').val()) == "") {
$('#searchInput').attr("value", "null");
}
}
Check for inputs whitespace characters.There may whitespace characters even though the input seems to be empty.Try to remove those whitespaces using the trim() method
you can use this code to get input value
function getInputValue(id) {
return document.getElementById(id).value.trim();
}
use
getInputValue("searchInput")
Your way is not wrong. You are using JQuery hence if you import jquery file in your page, It will work everytime. But instead of this code
$('#searchInput').attr("value", "null");
You have to use like this.
$('#searchInput').val('');
And if you want to use javascript you can check following
document.getElementById("#searchInput").value
before check null, you need to remove white space in input text. So you can use trim function
var str = " Hello World! ";
alert(str.trim());
if the browser does not support trim function, use following way
function myTrim(x) {
return x.replace(/^\s+|\s+$/gm,'');
}
function myFunction() {
var str = myTrim(" Hello World! ");
alert(str);
}
This worked for me.
function checkNullSearch() {
if ($(#searchInput').val().trim() == "") {
// it's empty
}
}
In my project, while a particular button is clicked I want to stop the next page appearing. Here is my JavaScript code:
function checkcond() {
check_value=document.getElementById("chkvalue");
if(check_value==null){
alert(check_value);
document.firstform.textview.focus();
return false;
}
}
and button code is:
<form id="payment_form" name="payment_form" action="<?php echo site_url("cont/accept");?>" method="post">
<input id="chkvalue" name="chkvalue" type="hidden">
<button type="submit" id="submit_button" class="btn btn-primary" onclick="checkcond()">
<b>Make a Payment</b>
<span class="fa fa-hand-o-right" aria-hidden="true"></span>
</button>
Here after checking the check_value I want to keep my current page while it is null. How should it be done? Is there any function for that?
My suggestion would be to remove inline javascript
and use like this
document.getElementById('payment_form').onsubmit = function() {
return checkcond();
};
or if you want to use inline method, change onclick method like this
<button type="submit" id="submit_button" class="btn btn-primary" onclick="return checkcond()"><b>Make a Payment</b>
I'm a newbie in coding and I need your expertise help.
This is my index.php codes
<div class="container">
<div class="row text-center"><h1>Stamford Network</h1></div>
<div class="row">
<div class="col-md-9">
<input type="textarea" name="text" placeholder="What's on your mind?" class="form-control" id="info" />
<input type="button" name="post" value="Post" class="btn btn-primary" id="post" />
</div>
<div class="col-md-3">
<h3>Hello,
<?php echo $_SESSION['username']; ?>
</h3>
<a class="btn btn-primary" href="login.php" role="button" >Logout</a>
</div>
</div>
<div class="row">
<div class="col-md-9">
<h4 id="display"></h4>
</div>
<div class="col-md-3"></div>
</div>
</div>
My .js code which link to the above index.php
window.onload = function() {
var button = document.getElementById("post");
button.addEventListener("click",
function() {
document.getElementById("display");
});
}
Can anyone tell me how create a post and display it without refreshing the page. Simply just click on the Post button then the information should appear below the posting form. While the words in the textarea should be gone when the button is clicked.
Please only show me the javascript way
var button = document.getElementById('post'),
info = document.getElementById('info'),
display = document.getElementById('display');
button.addEventListener('click', function(){
display.innerText = info.value;
info.value = '';
});
If you want the value to be uploaded to server for processing, you will need to add ajax XMLHttpRequest in the event listener.
Learn more about ajax here.
You should do it asynchronously.
First, use the tag to surround the data that you want to post:
<form>
...
</form>
Tutorial about forms:
https://www.w3schools.com/html/html_forms.asp
To post form asynchronously, you can use jquery or js. The simple and quick way is jquery. Here is a link to the documentation:
https://api.jquery.com/jquery.post/
There is an example at the end of the page of the jquery post doc's page, that explains how to use it, and basically do the thing that you wanted.
try this.
<script type="text/javascript">
window.onload = function() {
var button = document.getElementById("post");
button.addEventListener("click",
function() {
//document.getElementById("display");
document.getElementById('display').innerHTML = document.getElementById('info').value;
document.getElementById("info").style.display = "none";
});
}
</script>
product.php
function getdata(getdatafrom, resultclass){
$.get(getdatafrom, function(data) {
$(resultclass).html(data);
});
}
getdata('get.php?action=porsiyondurum2&id=<?php echo $urunid; ?>','#porsiyondurum2');
get.php
$action = htmlspecialchars(mysql_real_escape_string($_GET['action']));
if($action=="porsiyondurum2"){
$id = htmlspecialchars(mysql_real_escape_string($_GET['id']));
$urunporkont = mysql_query("SELECT * FROM porsiyon WHERE urunid='$id'");
$urunporkonts = mysql_num_rows($urunporkont);
while($urunporkontv = mysql_fetch_array($urunporkont)){
$porid = $urunporkontv['id'];
$porname = $urunporkontv['name'];
$porucret = $urunporkontv['ucret'];
echo '<tr><form action="post.php?action=porguncelle&id='.$porid.'" method="POST" target="frame'.$porid.'"><td><input name="porname" type="text" class="form-control" placeholder="'.$porname.'" value="'.$porname.'"></td><td><div class="input-group">
<input type="number" name="porucret" class="form-control" min="0" placeholder="'.$porucret.'" value="'.$porucret.'">
<span class="input-group-addon">₺</span>
</div></td><td class="text-center"><iframe name="frame'.$porid.'" src="not_submitted_yet.php" ></iframe><button class="btn btn-primary btn-sm" onClick="test()" type="submit"><i class="fa fa-edit"></i> Güncelle</button> <button class="btn btn-danger btn-sm" ><i class="fa fa-trash"></i> Sil</button></td></form></tr>';
}
echo '<tr><td><input type="text" class="form-control" placeholder="Porsiyon Adı"></td><td><div class="input-group">
<input type="number" class="form-control" min="0" placeholder="Ücret">
<span class="input-group-addon">₺</span>
</div></td><td class="text-center"><button class="btn btn-primary btn-sm"><i class="fa fa-plus"></i> Yeni Ekle</button></td></tr>';
}
As you can see. I can see get.php codes at product.php. But when I trying to frame post it. It doesnt work. Or I tried ajaxpost it didnt happened also. But when I copy this code to product.php It posts perfectly. How can I do this?
Edited: Guys its not php problem. I just wrote related part on get.php
$action is not defined (per the code you've provided), so your initial condition that the entire get.php script relies on, fails.
if($action=="porsiyondurum2"){
Because it's being passed in a GET querystring, you need to handle it in that manner, like your other values being passed:
if($_GET['action'] == "porsiyondurum2"){
See how you got the id by doing just that: $_GET['id']. Same applies for action.
In Addition
I don't see where you're connecting to your database in get.php, either. Is there more to the script than what you've posted here? If so, please add it to your post and I will remove this answer (unless it resolves your problem).