Is it safe to call php service from onClick? - php

What I want know that is that when form data is POST to a php service directly from onClick="insert.php" then is it safe. Please explain your answer with details.
for example:
<form role="form" method="POST" enctype="multipart/form-data">
<div class="form-group">
<label>User Id</label>
<input class="form-control" name="First Name">
</div>
<div class="form-group">
<label>City Id</label>
<input class="form-control" name="Last Name">
</div>
<button type="submit" class="btn btn-primary" onclick="allowStory.php">Allow</button><button type="submit" class="btn btn-primary" onclick="insert.php">Insert</button>
</form>
It also return to same page by executing php service as I wanted. But question is that is it safe? and is this type have any drawback? if yes then what are those?

Putting a filename in onclick doesn't do anything, the onclick attribute has to contain Javascript code.
If you want a submit button to go to a specific script instead of the action of the form, use the formaction attribute.
<button type="submit" class="btn btn-primary" formaction="allowStory.php">Allow</button><button type="submit" class="btn btn-primary" formaction="insert.php">Insert</button>
It's perfectly safe to do this, it's no different from specifying the action of the form in the action="scriptname.php" attribute of the <form> tag.

Use following HTML
<form role="form" method="POST" id="formsend" enctype="multipart/form-data">
<div class="form-group">
<label>User Id</label>
<input class="form-control" name="First Name">
</div>
<div class="form-group">
<label>City Id</label>
<input class="form-control" name="Last Name">
</div>
<input type="submit" name="submit" value="Submit" /></form>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
$(document).on('submit', '#formsend', function()
{
$.post('savedate.php', $(this).serialize(), function(data)
{
$("#sent").html(data);
});
return false;
});
and create a savedata.php or any other name and put your php code to save data in it. you can not give filename to onclick event

Related

Hide Placeholder On Form Focus works only on one form

I am using a jQuery function which work to hide placeholder text on form focus, this functions works perfectly on the form in main page (Index.php), however it is not working on other forms which are designed using bootstrap (Members.php) as an example. I have tried to see where is the issue but it seems not working. I don't know if version incompatibility of both Bootstrap and jQuery caused this issue?!
I am using
- jquery-3.4.1.min.js
- bootstrap-3.3.7
=========================Backend.js=================================
// here is the jQuery function
$(function(){
'use strict';
// Hide Placeholder On Form Focus
$('[placeholder]').focus(function (){
$(this).attr('data-text',$(this).attr('placeholder'));
$(this).attr('placeholder', '');
}).blur(function (){
$(this).attr('placeholder',$(this).attr('data-text'));
});
});
==============================Index.php=====================================
// Here is the form where the jQuery function works fine
<form class="login" action="<?php echo $_SERVER['PHP_SELF']?>" method = "POST">
<h4 class="text-center">Admin Login</h4>
<input class = "form-control input-lg" type="text" name="user" placeholder="Username" autocomplete="off"/>
<input class = "form-control input-lg" type="password" name="pass" placeholder="Password" autocomplete="new-password"/>
<input class = "btn btn-lg btn-primary btn-block" type="submit" value="Login" />
</form>
===============================Members.php===================================
// Function doesn't work on this form
<div class="container">
<form class="form-horizontal" action="?do=Insert" method="POST">
<!-- start username field -->
<div class="form-group">
<label class="col-sm-2 control-label" >Username</label>
<div class="col-sm-8">
<input type="text" name="username" class="form-control" autocomplete="off" required = "required" placeholder="Enter User Name" />
</div>
</div>
</form>
</div>
var input = $("input");
input.focus(function(){
$(this).attr("placeholder", " ")
});
input.blur(function(){
$(this).attr("placeholder", "example")
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" placeholder="example">

Prevent first form submit when submit second from

Here is the deal (using php and laravel-5.2).
I have some forms in a page, and when i submit another form not the first one then it keeps submit the first form.
Here my html code:
<form method="POST" action="http://localhost:8888/candidates/18" accept-charset="UTF-8" id="name-edit" style="display:none">
<input name="_method" type="hidden" value="PUT">
<input name="_token" type="hidden" value="xxzvu6HIqP8k2kg78pxuHiTc8NWftjNL1IJvxbDo">
<div class="form-group ">
<div class="col-xs-12 col-sm-5 ">
<input placeholder="Full Name" error="" id="name-input" class="width-100" name="name" type="text" value="chi qua uqaaa1232">
</div>
</div>
<button class="green btn-link col-xs-4" type="submit"><i class="ace-icon glyphicon glyphicon-ok"></i> Click to save or press Enter</button>
</form>
<form method="POST" action="http://localhost:8888/candidates/18" accept-charset="UTF-8" id="address-edit" style="display:none">
<input name="_method" type="hidden" value="PUT">
<input name="_token" type="hidden" value="xxzvu6HIqP8k2kg78pxuHiTc8NWftjNL1IJvxbDo">
<div class="form-group ">
<div class="col-xs-12 col-sm-5 ">
<input placeholder="Address" error="" id="address-input" class="width-100" name="address" type="text" value="nha xacdawdwad">
</div>
</div>
<button class="green btn-link col-xs-4" type="submit"><i class="ace-icon glyphicon glyphicon-ok"></i> Click to save or press Enter</button>
</form>
My jquery code for both forms:
$(document).ready(function(){
$("#name-edit").focusout(function() {
$('#name-edit').css('display', 'none');
$('#name-view').css('display', 'inline');
});
$("#address-edit").focusout(function() {
$('#address-edit').css('display', 'none');
$('#address-view').css('display', 'inline');
});
});
$('#btn-edit-name').click(function () {
var name = $('#name-view').css('display', 'none').clone().children().remove().end().text();
$('#name-input').val(name);
$('#name-edit').css('display', 'inline').focus();
});
$('#btn-edit-address').click(function () {
var name = $('#address-view').css('display', 'none').clone().children().remove().end().text();
$('#address-input').val(name);
$('#address-edit').css('display', 'inline').focus();
});
btn-edit-name and btn-edit-address for showing the form. thanks for your consider.
here is my UI:
You can't submit 2 forms simultaneously.
Instead of having 2 forms for name and address fields you can add them into single form like below:
<form method="POST" action="http://localhost:8888/candidates/18" accept-charset="UTF-8" id="name-edit" style="display:none">
<input name="_method" type="hidden" value="PUT">
<input name="_token" type="hidden" value="xxzvu6HIqP8k2kg78pxuHiTc8NWftjNL1IJvxbDo">
<div class="form-group ">
<div class="col-xs-12 col-sm-5 ">
<input placeholder="Full Name" error="" id="name-input" class="width-100" name="name" type="text" value="chi qua uqaaa1232">
</div>
</div>
<div class="form-group ">
<div class="col-xs-12 col-sm-5 ">
<input placeholder="Address" error="" id="address-input" class="width-100" name="address" type="text" value="nha xacdawdwad">
</div>
</div>
<button class="green btn-link col-xs-4" type="submit"><i class="ace-icon glyphicon glyphicon-ok"></i> Click to save or press Enter</button>
</form>
If you wish to show hide them on click then you can add some jQuery to do so.
oh i found the answer that set the type submit button to button then make jquery for click event $(this).closest('form').submit()
You can either have two different actions
action="http://localhost:8888/candidates/18"
action="http://localhost:8888/candidates/19"
If not possible add different hidden input to each form like
In form 1 add this line
<input type="hidden" name="identifier" value="form1">
In form 2 add this line
<input type="hidden" name="identifier" value="form2">
Now you can either use if ($_POST['identifier'] == 'form1')
OR
You can use a switch statement also
switch($_POST['identifier']){
case 'form1':{}
case 'form2':{}
}
Also your two submit buttons are identical. You can set a value for each that you can check after submission. Set value like this
For form 1 name
<button class="green btn-link col-xs-4" type="submit" value="name" name="name"><i class="ace-icon glyphicon glyphicon-ok"></i> Click to save or press Enter</button>
For form 2 address
<button class="green btn-link col-xs-4" type="submit" value="address" name="address"><i class="ace-icon glyphicon glyphicon-ok"></i> Click to save or press Enter</button>

php can't get the text from a text area

I can't figure out why this doesnt get the value of the textarea. I've been to loads of stackoverflow posts and I can't figure out what's wrong. I've tried getting values from textfields, from dropdown lists etc and they all work I just can't get the textarea to work. I've using _GET instead, still didnt work.
This is the message I get if I don't use the isset function: Notice: Undefined index: descri.
Here's the HTML:
<form role="form" action="saveform.php" method="post" name="eventform">
<div class="form-group">
<label for="descri">Description</label>
<textarea name="descri" form="eventform" style="resize:none"></textarea>
</div>
<button type="submit" class="btn btn-default" id="addform">add</button>
</form>
PHP:
<?php
if(isset($_POST['descri']))
{
echo htmlspecialchars($_POST['descri']);
} else {
echo "DOESNTWORK";
}
?>
Just remove form attribute from textarea:
<textarea name="descri" form="eventform" style="resize:none"></textarea>
Remove form attribute from textarea that is located inside the form:
<form role="form" action="saveform.php" method="post" name="eventform">
<div class="form-group">
<label for="descri">Description</label>
<textarea name="descri" style="resize:none"></textarea>
</div>
<button type="submit" class="btn btn-default" id="addform">add</button>
</form>
You have to use it only when your textarea is outside the form (remember form should have id not just name:
<form role="form" action="saveform.php" method="post" id="eventform">
<div class="form-group">
<label for="descri">Description</label>
</div>
<button type="submit" class="btn btn-default" id="addform">add</button>
</form>
<textarea name="descri" form="eventform" style="resize:none"></textarea>
Remove form="eventform" attribute from your <textarea> element. You do not need to set it as your <form> will post your data.
<form role="form" action="saveform.php" method="post" name="eventform">
<div class="form-group">
<label for="descri">Description</label>
<textarea name="descri" style="resize:none"></textarea>
</div>
<button type="submit" class="btn btn-default" id="addform">add</button>
</form>

How to return php code into html body

I am building a simple form script that collects a users email and returns a PIN.
The input sits in standard HTML below:
<p>
<form class="form-inline" role="form" method="POST">
<div class="form-group">
<label class="sr-only" for="srEmail">Email address</label>
<input type="email" name="srEmail" class="form-control input-lg" id="srEmail" placeholder="Enter email">
</div>
<button type="submit" name="srSubmit" class="btn btn-default btn-lg">Generate PIN</button>
</form>
</p>
I have the following if statement that checks the database to see if the email already exists, and if the user would like a PIN reminder.
if($num_rows != 0) {//if email found in table
?>
Email already registered, would you like a PIN reminder?
<form method="POST" action="">
<input type="submit" name="srSend" value="Click here to get pin reminder" />
<input type="hidden" name="srEmail" value="<?php echo strtolower($email);?>" />
</form>
<?php
exit;
}
At the moment, this returns the result to the user as a new page; how do I put this in the actual HTML of the body page, so it would actually appear below the original form input in a new <p> element?
This is a piece of cake with jquery.post
include the jquery library in your html head and you'll need a short script to get the php content by ajax
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(function(){
$('#yourForm').submit(function(e){
e.preventDefault();
var data=$('#yourForm').serialize();
$.post('yourphp.php',data,function(html){
$(body).append(html);
});
});
});
</script>
</head>
<body>
<p>
<form id="yourForm" class="form-inline" role="form" method="POST">
<div class="form-group">
<label class="sr-only" for="srEmail">Email address</label>
<input type="email" name="srEmail" class="form-control input-lg" id="srEmail" placeholder="Enter email">
</div>
<button type="submit" name="srSubmit" class="btn btn-default btn-lg">Generate PIN</button>
</form>
</p>
</body>
You could able to achieve that without ajax too. Simply use a hidden iframe in your main page, then set the target attribute of your form to the iframe as follows:
<form method="post" action="page.php" target="myIframe">
.....
</form>
<p id="theResultP"></p>
<iframe src="#" name="myIframe" style="visibility: hidden"></iframe>
The question now, How could you make the page loaded in the iframe "page.php" to interact with the opener page to update the p. This may be done as follow:
//page.php
<script>
result = parent.document.getElementById('theResultP');
result.innerHtml = "<b>The message you want</b>"
</script>
I dont know if I get what you asking for,but this is my solution :
<p>
<form class="form-inline" role="form" method="POST">
<div class="form-group">
<label class="sr-only" for="srEmail">Email address</label>
<input type="email" name="srEmail" class="form-control input-lg" id="srEmail" placeholder="Enter email">
</div>
<button type="submit" name="srSubmit" class="btn btn-default btn-lg">Generate PIN</button>
</form>
</p>
<?php
if (isset($message)){
<p><?php print $message ?></p>
?>
<?php
}
?>
and in top of your file write something like this :
<?php
if($_post['srSend']){
$message='write your message here';
}
?>

Using "action" in Twitter Boostrap classes

I'm a newbie programmer trying to utilize Twitter Bootstrap to build out a concept. I'm using PHP and assigning actions within HTML tags to POST data and essentially take a user through the navigation. This has been pretty straightforward when using forms: i.e. here is a snippet that does work. For example, for this snippet of HTML:
<form action="?viewnotes" method="post">
<input type="hidden" name="id" value="<?php htmlout($note['id']); ?>">
</form>
It successfully triggers the following if statement in my index.php:
if (isset($_GET['viewnotes']))
However, I'm trying to do the same thing in my registration page, using a Twitter Bootstrap class for buttons. Here is the HTML:
<a class="btn btn-primary btn-large" action="?register">Sign Up Free!ยป</a></p>
The PHP code is:
if (isset($_GET['register']))
{
include 'register.html.php';
}
Clicking on the Sign Up button is not invoking the PHP code. If I hard code the URL it works, but then I have a similar issue on the register.html.php page. HTML on the register page has:
<form class="form-horizontal" action="?storeuser" method="post">
<fieldset>
<legend>It's quick and easy...</legend>
<div class="control-group">
<label class="control-label">First Name</label>
<div class="controls">
<input type="text" name="fname" class="input-xlarge" id="fname">
</div>
</div>
<div class="control-group">
<label class="control-label" name="lname">Last Name</label>
<div class="controls">
<input type="text" name="lname" class="input-xlarge" id="lname">
</div>
</div>
<div class="control-group">
<label class="control-label" name="email">Email Address</label>
<div class="controls">
<input type="text" name="email" class="input-xlarge" id="email">
</div>
</div>
<div class="control-group">
<label class="control-label" name="password">Password</label>
<div class="controls">
<input type="password" name="password" class="input-xlarge" id="password">
</div>
</div>
</fieldset>
<button type="submit" name="action" class="btn btn-primary btn-large">Complete Registration</button>
</form>
However, when clicking on the button, the index file does not trigger the following, which would store the fields into the DB.
if (isset($_GET['storeuser']))
If I hardcode the URL to register.html.php, then the resulting URL looks like localhost/register.html.php?storeuser instead of localhost/?storeuser. I'm not sure if that's affecting the behavior here.
Thank you for the help!
I think you're approaching this the wrong way, and it's not Twitter Bootstrap's fault.
Usually, you'd use POST, not GET, to handle user registrations. Your form would look like this:
<form action="register.php" method="post">
<!-- your form -->
<fieldset>
<input type="submit" name="register" value="Register" class="btn btn-primary" />
</fieldset>
</form>
You can then build register.php as follows:
<?php
if (isset($_POST['register'])) {
// handle user registration
}
// display form
?>
This will display the form when the user visits register.php, but will try and process the user registration first if the form's been POSTed.
try passing a value with your GET variable
<form action="?viewnotes=1" method="post">

Categories