i have embedded jquery and and it is working ..but there is a small problem with that query... when empty form is submitted , it shows errors with fieds and the form without error...i mean.. it shows double input field... what should be the main problem behind this...?
here is contoller Action:
public function add() {
if ($this->request->is('post')) {
if(!empty($this->data)){
$this->Post->create();
if ($this->Post->save($this->data)) {
if($this->RequestHandler->isAjax()){
$this->render('success','ajax');
}
else{
$this->Session->setFlash(__('Your post has been saved.'));
$this->redirect(array('action' => 'index'));
}
}
$this->Session->setFlash(__('Unable to add your post.'));
}
}
}
public function validate_form()
{
if($this->RequestHabdler->isAjax())
{
$this->data['Post'][$this->params['form']['field']]=$this->params['form']['value'];
$this->Post->set($this->data);
if($this->Post->validates()){
$this->autoRender=false;
}
else {
$error=$this->validateErrors($this->Post);
$this->set('error',$error[$this->params['form']['field']]);
}
}
}
here is validation js file:
$(document).ready(function (){
$('#title').blur(function(){
$.post(
'/cakephp/posts/validate_form',
{field:$('#title').attr('id'),value:$('#title').val()},
handleTitleValidation
);
function handleTitleValidation(error)
{
if(error.length>0){
if($('#title-notEmpty').length==0){
$('#sending').after('<div id="notEmpty" class="error-message">'+error+"</div>");
}
}
$('#title-notEmpty').remove();
}
});
$('#body').blur(function(){
$.post(
'/cakephp/posts/validate_form',
{field:$('#body').attr('id'),value:$('#body').val()},
handleBodyValidation
);
function handleBodyValidation(error)
{
if(error.length>0){
if($('#body-notEmpty').length==0){
$('#sending').after('<div id="notEmpty" class="error-message">'+error+"</div>");
}
}
$('#body-notEmpty').remove();
}
});
});
here is add.ctp
<!-- File: /app/View/Posts/add.ctp -->
<?php echo $this->Html->script('jquery',false);?>
<?php echo $this->Html->script('validation',false);?>
<div id="success" style="background-color: lightgreen;"></div>
<h1>Add Post</h1>
<?php
echo $this->Form->create('Post');
echo $this->Form->input('title', array('id'=>'title'));
echo $this->Form->input('body', array('rows' => '3','id'=>'body'));
echo $this->Js->submit('Save Post', array(
'before'=>$this->Js->get('#sending')->effect('fadeIn'),
'success'=>$this->Js->get('#sending')->effect('fadeOut'),
'update'=>'#success'
) );
?>
<div id="sending" style="display:none;">
<?php echo $this->Html->image('ajax-loader.gif', array('alt' => 'Loading...')); ?>
</div>
this is what i get... html source code:
<form id="PostAddForm" accept-charset="utf-8" method="post" action="/cb/cakephp/posts/add">
<div style="display:none;">
<input type="hidden" value="POST" name="_method">
</div>
<div class="input text required error">
<label for="title">Title</label>
<input id="title" class="form-error" type="text" required="required" value="" maxlength="50" name="data[Post][title]">
<div class="error-message">This field cannot be left blank</div>
</div>
<div class="input textarea required error">
<label for="body">Body</label>
<textarea id="body" class="form-error" required="required" cols="30" rows="3" name="data[Post][body]"></textarea>
<div class="error-message">This field cannot be left blank</div>
</div>
<div class="submit">
<input id="submit-1060465790" type="submit" value="Save Post">
</div>
<div id="sending" style="display:none;">
</form>
</div>
<h1>Add Post</h1>
<form id="PostAddForm" accept-charset="utf-8" method="post" action="/cb/cakephp/posts/add">
<div style="display:none;">
<div class="input text required">
<label for="title">Title</label>
<input id="title" type="text" required="required" maxlength="50" name="data[Post][title]">
</div>
<div class="input textarea required">
<label for="body">Body</label>
<textarea id="body" required="required" cols="30" rows="3" name="data[Post][body]"></textarea>
</div>
<div class="submit">
<input id="submit-1878163930" type="submit" value="Save Post">
Related
In a php form, I want to use summernote textaera. I manage to display the text correctly but when I validate the form, I can not recover the data entered. Here is my code Thank you for your help
My code :
<form action="<?php echo $action; ?>"method="post" onsubmit="return postForm()">
<div class="col-lg-6 col-md-2">
<div class="form-group" ">
<label>Date</label>
<input type="text" name="date_pub" class="form-control" id="date_pub" size="10" value="<?php echo $date_article ?>" placeholder="Date de la Publication"/>
</div>
<div class="form-group">
<label>Titre Publication</label>
<input class="form-control" name="titre_pub" type="text" size="25" value="<?php echo $titre_article ?>" placeholder="Titre de la Publication"/>
</div>
<div class="control-group">
<label class="control-label" for="summernote">Article</label>
<div class="controls">
<textarea id="summernote" name ="summernote" rows="10" value="<?php echo $contenu_article; ?>">
</textarea>
</div>
</div>
<div class="control-group">
<br>
<input type="submit" class="btn btn-primary" value="<?php echo $lib_btn ?>">
</div>
</div>
</form>
<script>
$( function() {
$( "#date_pub" ).datepicker( $.datepicker.regional[ "fr" ] );
} );
// Summernote
$(function () {
$('#summernote').summernote(
{
height: 600, // set editor height
focus: true // set focus to editable area after initializing summernote
}
)
});
//var html = $('#summernote').summernote('code');
</script>
<script type="text/javascript">
$(document).ready(function(){
var postForm = function() {
var content = $('textarea[name="summmernote"]').html($('#summernote').code());
}
});
</script>
I tried to do as for other textaera but it doesn’t work
When i submit form it doesnot update value in database mysql.Its a form written in php.
here is my php and html. I want that the form should not reload and it must submit the changes in database without reloading the page and show preloader for 1 sec on submitting form.
HTML,PHP AND ACTION of form: Here action is the current page where this form is avalilable
detail_customer.php
<?php
$server = "localhost";
$username = "root";
$pass = "";
$dbname = "stinkspolitics_pl";
$conn = mysqli_connect($server, $username, $pass, $dbname);
if (isset($_GET['detail_customer'])) {
$quest_id = $_GET['detail_customer'];
$get_quest = "SELECT * FROM questions WHERE quest_id = '$quest_id'";
$getting_quest = mysqli_query($conn, $get_quest);
while ($row = mysqli_fetch_assoc($getting_quest)) {
$quest_title = $row['quest_title'];
$category_id = $row['category_id'];
}
}
if (isset($_POST['submit'])) {
$quest_t = $_POST['quest_t'];
$update = "UPDATE questions SET quest_title = '$quest_t' WHERE quest_id = '$quest_id'";
$run_update = mysqli_query($conn, $update);
if ($run_update) {
echo 'hello';
}
}
?>
<div class="recent-orders cust_det ">
<h2> Customer Detail</h2>
<div class="customer_detail">
<form id="form-submit" action="./inc/detail_customer.php
" method="POST" class="c_form animate__animated animate__fadeIn">
<div class='alert alert-success'>
<strong>Success!</strong> Your question has been submitted.
</div>
<div class='alert alert-danger'>
<strong>Sorry!</strong> Your question has not been submitted.
</div>
<div class="row">
<div class="c_detail">
<label for="" class="form-labels">Name</label>
<input type="text" name="cat_id" value="<?php echo $category_id ?>" id="cat_id">
</div>
<div class="c_detail">
<label for="" class="form-labels">Contact</label>
<input type="text" name="quest_t" value="<?php echo $quest_title ?>" id="quest_t">
</div>
<div class="c_detail">
<label for="" class="form-labels">City</label>
<input type="text" name="" id="">
</div>
</div>
<div class="row">
<div class="c_detail">
<label for="" class="form-labels">Name</label>
<input type="text" name="" id="">
</div>
<div class="c_detail">
<label for="" class="form-labels">Contact</label>
<input type="text" name="" id="">
</div>
<div class="c_detail">
<label for="" class="form-labels">City</label>
<input type="text" name="" id="">
</div>
</div>
<div class="row">
<input name="submit" type="hidden" />
<input class="btn-primary submit-btn" type="submit" name="" value="Submit">
</div>
</form>
</div>
</div>
JS Code
index.js
$("#form-submit").on("submit", function () {
// e.preventDefault();
var form = $(this);
var formData = form.serialize();
$.ajax({
type: "POST",
url: form.attr("action"),
data: formData,
success: function (data) {
$(".alert-success").show();
$(".alert-success").fadeOut(4000);
console.log(data);
},
error: function (data) {
$(".alert-danger").show();
$(".alert-danger").fadeOut(4000);
console.log(data);
},
});
return false;
});
Ajax Success Response But not updating data in mySQL
<div class="recent-orders cust_det ">
<h2> Customer Detail</h2>
<div class="customer_detail">
<form id="form-submit" action="./inc/detail_customer.php" method="POST"
class="c_form animate__animated animate__fadeIn">
<div class='alert alert-success'>
<strong>Success!</strong> Your question has been submitted.
</div>
<div class='alert alert-danger'>
<strong>Sorry!</strong> Your question has not been submitted.
</div>
<div class="row">
<div class="c_detail">
<label for="" class="form-labels">Name</label>
<input type="text" name="cat_id" value="<br />
<b>Warning</b>: Undefined variable $category_id in <b>C:\xampp\htdocs\admin_panel\inc\detail_customer.php</b> on line <b>62</b><br />
" id="cat_id">
</div>
<div class="c_detail">
<label for="" class="form-labels">Contact</label>
<input type="text" name="quest_t" value="<br />
<b>Warning</b>: Undefined variable $quest_title in <b>C:\xampp\htdocs\admin_panel\inc\detail_customer.php</b> on line <b>66</b><br />
" id="quest_t">
</div>
<div class="c_detail">
<label for="" class="form-labels">City</label>
<input type="text" name="" id="">
</div>
</div>
<div class="row">
<div class="c_detail">
<label for="" class="form-labels">Name</label>
<input type="text" name="" id="">
</div>
<div class="c_detail">
<label for="" class="form-labels">Contact</label>
<input type="text" name="" id="">
</div>
<div class="c_detail">
<label for="" class="form-labels">City</label>
<input type="text" name="" id="">
</div>
</div>
<div class="row">
<input name="submit" type="hidden" />
<input class="btn-primary submit-btn" type="submit" name="" value="Submit">
</div>
</form>
</div>
</div>
The condition if (isset($_POST['submit'])) { will never evaluate to true, since there is no input element in the form with name="submit" (the button with name='submit' does not send the attribute by default).
Either change the condition:
if (isset($_POST['quest_t'])) { ...
Or, include an input element with name='submit', for example:
<input name="submit" type="hidden" />
Also, make sure to move the $_POST check at the beginning of the file and ensure that no other code will be evaluated in the PHP file (e.g. the rest of the HTML code) if a POST request has been received.
Just return false after at the end of the method.
jQuery has its own way of ensuring "preventDefault()" and it is just returning false from the submit handler.
Full background on this here:
event.preventDefault() vs. return false
Issue has been solved. By changing path and then putting path of js file again.
my form is not posting values even though i have put method="post" and i think there is no error in my form.i have hide some input types by javascript. i am not understanding where the problem is can you rectify that ..my code is
<?php include "header.php" ?>
<!DOCTYPE html>
<html>
<head>
<style>
</style>
</head>
<body>
<div class="col-md-9" style="padding-top:10px;">
<h3 align="center">Blood Bank Registration </h3>
<form role="form" action="bbinsert.php" method="post" style="color:black">
<div class="form-group">
<input type="text" class="form-control" name="bbname" id="college" placeholder="Blood bank name" required>
</div>
<div class="form-group">
<select class="form-control" id="district" name="district" required>
<option >Select District</option>
<option value="prakasam">Prakasam</option>
<option value="guntur">Guntur</option>
<option value="Nellore">Nellore</option>
</select>
</div>
<div class="form-group">
<select class="form-control" id="mandal" name="mandal" required>
<option >Select Mandal</option>
</select>
</div>
<div class="form-group">
<select class="form-control" id="village" name="village" required>
<option >Select Village</option>
</select>
</div>
<div class="form-group" >
<input type="text" class="form-control" name="phno" placeholder="contact number" >
</div>
<p align="right">create employee<button onclick="return show();"><span class="glyphicon glyphicon-plus" ></span></button></p>
<div id="empform" style="display:none;" >
<div class="form-group">
<input type="text" class="form-control" name="empname1" placeholder="Employee Name" >
</div>
<div class="form-group">
<input type="text" class="form-control" name="empid1" placeholder="Employee Id" >
</div>
<div class="form-group">
<input type="text"class="form-control" name="password1" placeholder="password" >
</div>
<div class="form-group">
<input type="text"class="form-control" name="phno1" placeholder="Contact Number">
</div>
<p align="right"><button onclick="return hide();"><span class="glyphicon glyphicon-minus" ></span></button><button onclick="return show1();"><span class="glyphicon glyphicon-plus" ></span></button></p>
</div>
<div id="empform2" style="display:none;" >
<div class="form-group">
<input type="text" class="form-control" name="empname3" placeholder="Employee Name" >
</div>
<div class="form-group">
<input type="text" class="form-control" name="empid3" placeholder="Employee Id" >
</div>
<div class="form-group">
<input type="text"class="form-control" name="password3" placeholder="password" >
</div>
<div class="form-group">
<input type="text"class="form-control" name="phno3" placeholder="Contact Number">
</div>
<p align="right"><button onclick="return hide2();"><span class="glyphicon glyphicon-minus" ></span></button></p><br>
</div>
<input type="submit" class="btn btn-success" value="create" >
</form>
<script>
function show() {
if(document.getElementById('empform').style.display=='none') {
document.getElementById('empform').style.display='block';
}
return false;
}
function hide() {
if(document.getElementById('empform').style.display=='block') {
document.getElementById('empform').style.display='none';
}
return false;
}
function show1() {
if(document.getElementById('empform1').style.display=='none') {
document.getElementById('empform1').style.display='block';
}
return false;
}
function hide1() {
if(document.getElementById('empform1').style.display=='block') {
document.getElementById('empform1').style.display='none';
}
return false;
}
function show2() {
if(document.getElementById('empform2').style.display=='none') {
document.getElementById('empform2').style.display='block';
}
return false;
}
function hide2() {
if(document.getElementById('empform2').style.display=='block') {
document.getElementById('empform2').style.display='none';
}
return false;
}
</script>
bbinsert.php
<?php
include "connection.php";
if (isset($_POST['submit']))
{
$bbname=$_POST['bbname'];
$district=$_POST['district'];
$mandal=$_POST['mandal'];
$village=$_POST['village'];
$phno=$_POST['phno'];
$insertbb=mysqli_query($conn,"INSERT INTO bloodbanks(bbname,bbdistrict,bbmandal,bbcity,phno)VALUES('$bbname','$district',$mandal','$village','$phno')");
if(!$insertbb)
echo "error in blood bank insertion".mysqli_error($conn);
else
echo "successfully inserted blood banks";
$emp1 = array('empname1', 'empid1', 'password1','phno1');
$emp2 = array('empname2', 'empid2', 'password2','phno2');
$emp3 = array('empname3', 'empid3', 'password3','phno3');
$error = false; //No errors yet
foreach($emp1 AS $fieldname)
{ //Loop trough each field
if(!isset($_POST[$fieldname]) || empty($_POST[$fieldname]))
{
$error = true; //Yup there are errors
}
}
if(!$error) {
$empn1=$_POST['empname1'];
$empid1=$_POST['empid1'];
$password1=$_POST['password1'];
$phno1=$_POST['phno1'];
$insert1=mysqli_query($conn,"INSERT INTO employees(name,empid,password,phno,bbname)VALUES('$empn1','$emmpid1','$password1 ','$phno1','$bbname')");
if(!$insert1)
echo "error in emp1".mysqli_error($conn);
else
echo "success emp1";
}
$error1 = false; //No errors yet
foreach($emp2 AS $fieldname)
{ //Loop trough each field
if(!isset($_POST[$fieldname]) || empty($_POST[$fieldname]))
{
$error1 = true; //Yup there are errors
}
}
if(!$error1) {
$empn2=$_POST['empname2'];
$empid2=$_POST['empid2'];
$password2=$_POST['password2'];
$phno2=$_POST['phno2'];
$insert2=mysqli_query($conn,"INSERT INTO employees(name,empid,password,phno,bbname)VALUES('$empn2','$emmpid2','$password2','$phno2','$bbname')");
if(!$insert2)
echo "error in emp2".mysqli_error($conn);
else
echo "success emp2";
}
$error3 = false; //No errors yet
foreach($emp3 AS $fieldname)
{ //Loop trough each field
if(!isset($_POST[$fieldname]) || empty($_POST[$fieldname]))
{
$error3 = true; //Yup there are errors
}
}
if(!$error3) {
$empn3=$_POST['empname3'];
$empid3=$_POST['empid3'];
$password3=$_POST['password1'];
$phno3=$_POST['phno3'];
$insert3=mysqli_query($conn,"INSERT INTO employees(name,empid,password,phno,bbname)VALUES('$empn3','$emmpid3','$password3','$phno3','$bbname')");
if(!$insert3)
echo "error in emp3".mysqli_error($conn);
else
echo "success emp3";
}
}
else
{
echo "submit method did not post the form";
}
?>
`
Your submit button doesn't have a name attribute. So no post element called "submit" exists. Put a name on your submit button if you want it to post.
I am validating form with jquery. So when form submit i am using event.preventDefault(); after validate form , form will be submit to respective action page.But in my case it doesn't work.
Code what i did-
$('form[name=contact_form]').submit(function(event) {
event.preventDefault();
var formData = $('form[name=contact_form]').serialize();
var phone = $.trim($('form[name=contact_form]').find('input[name=PHONE]').val()).length;
var intRegex = /[0-9 -()+]+$/;
var alert = $('#contact_alert');
var success = $('#contact_success');
if(phone==0){
phone.focus();
alert.html("<p class='alert alert-danger' style='text-align:left;'>Phone number is required</p>");
}
else if((phone < 10)){
phone.focus();
alert.html("<p class='alert alert-danger' style='text-align:left;'>Please enter a valid phone number</p>");
return false;
}else{
return true;
}
});
Html Page :
<?php
echo form_open_multipart('home/inquiry', array('name' => 'contact_form'));
?>
<div class="row">
<div class="col-md-6">
<div class="form-group">
<input type="hidden" name="form_type" value="C">
<input type="text" name="NAME" id="user-name" class="form-control" placeholder="Full Name"/>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<input type="text" name="PHONE" id="user-phone" class="form-control" placeholder="Phone"/>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<input type="text" name="EMAIL" id="user-email" class="form-control" placeholder="Email"/>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<input type="text" name="SUBJECT" id="user-subject" class="form-control" placeholder="Reason for inquiry"/>
</div>
</div>
<div class="col-md-12">
<textarea class="form-control" name="MESSAGE" id="user-message" placeholder="Message"></textarea>
</div>
<div class="col-md-12 text-left">
<div class="form-group">
<input type="submit" name="submit" class="btn btn-warning">
</div>
</div>
</div>
<?php echo form_close(); ?>
Do not call event.preventDefault(); if you want the form to be submitted after it validates ok.
Returning false after failed validation is enough.
$(this).submit();
When it's valid.
Try to replace the return true; for $(this).submit();
I usually do something like
$("#submit").submit(function(e){
if(validateFields() == true){ //If all fields are valid
$("#submit").submit();
}
else{
e.preventDefault(e);
}
});
CS-Cart ajax is working fine, I am also getting response but how can I use this response with html/js on my view(checkout.tpl) file.
Controller (front-end) : send_sms.php
use Tygh\Registry;
use Services_Twilio;
use Tygh\Ajax;
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
if ($mode == 'send_sms') {
$status = 1;
$response = array(
'status' =>$status,
'data' =>'Hello World',
);
if($status == 1) {
fn_set_notification('N', fn_get_lang_var('success'), fn_get_lang_var('sms_sent'), true);
} else {
fn_set_notification('E', fn_get_lang_var('warning'), fn_get_lang_var('sms_failed'), true);
}
$val=json_encode($response);
Registry::get('ajax')->assign('result', $val);
}
exit;
}
View checkout.tpl (design/themes/responsive/templates/views/checkout/checkout.tpl)
<div id="result">
<!-- id="result" -->
<!-- result -->
</div>
<h2>Verify your number</h2>
<form class="cm-ajax" action="index.php" method="post" name="send_sms">
<input type="hidden" name="result_ids" value="result" />
<div class="form-control send_sms_block">
<input type="text" name="country_code" id="country_code" disabled value="+92"/>
<input type="text" name="carrier_code" id="carrier_code" disabled value="300"/>
<i class="ty-icon-down-micro open_cr"></i>
<input type="text" name="phone" id="phone"/>
<div class="carrier_list hidden">
<ul>
<li>301</li>
<li>302</li>
</ul>
</div>
</div>
<div class="clearfix"></div>
<input class="ty-btn ty-btn__big" id="send_sms" type="submit" value="Send Pin" name="dispatch[send_sms.send_sms]"/>
</form>
Please try the following solution:
php file:
use Tygh\Registry;
use Services_Twilio;
use Tygh\Ajax;
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
if ($mode == 'send_sms') {
$status = 1;
$response = array(
'status' =>$status,
'data' =>'Hello World',
);
if($status == 1) {
fn_set_notification('N', fn_get_lang_var('success'), fn_get_lang_var('sms_sent'), true);
} else {
fn_set_notification('E', fn_get_lang_var('warning'), fn_get_lang_var('sms_failed'), true);
}
$val=json_encode($response);
Registry::get('view')->assign('result', $val);
Registry::get('view')->display('views/path/to/tpl/file.tpl');
}
exit;
}
tpl file:
<div id="result">
{if $result}{$result}{/if}
<!--result--></div>
<h2>Verify your number</h2>
<form class="cm-ajax" action="index.php" method="post" name="send_sms">
<input type="hidden" name="result_ids" value="result" />
<div class="form-control send_sms_block">
<input type="text" name="country_code" id="country_code" disabled value="+92"/>
<input type="text" name="carrier_code" id="carrier_code" disabled value="300"/>
<i class="ty-icon-down-micro open_cr"></i>
<input type="text" name="phone" id="phone"/>
<div class="carrier_list hidden">
<ul>
<li>301</li>
<li>302</li>
</ul>
</div>
</div>
<div class="clearfix"></div>
<input class="ty-btn ty-btn__big" id="send_sms" type="submit" value="Send Pin" name="dispatch[send_sms.send_sms]"/>
</form>
Please replace on send_sms.php
$val=json_encode($response);
Registry::get('ajax')->assign('result', $val);
with
echo '<div id="result">'.json_encode($response).'</div>';