How to validate name="novs[78][] using jquery validation? - php

<?php
for ($i=0; $i < $total_vehicles; $i++) {
$id=$edtVehicle[$i]->id;
$chasis=$edtVehicle[$i]->chasis;
?>
//HTML CONTENT "novs[][]" want to validate it using jquery validation
<div class="controls content contold">
<input type="hidden" name="hid_novs[]" value="<?php echo $id;?>">
<input type="text" name="novs[<?php echo $id;?>][]" id="novs_<?php echo $i;?>" value="<?php echo $chasis;?>">
<button type="button" class="removebtn"><i class="fa fa-times"></i></button>
<span class="span_error"></span>
</div>
<?php
}
?>
JQUERY VALIDATION
$("#add_user_form").validate({
"novs[]":{ required:true, },
messages: { "novs[]":{ required : "Please fill this value" }, }
});

I Solved it with this way, it's solved now thank you.
$("input[name^='novs_'" ).each(function(){
$(this).rules("add", {
required: true,
messages: {
required: "Fill a valid value"
}
});
});

Hope fully this will helps you to get id
$('.removebtn').click(function() {
//console.log( $(this).siblings('.removebtn'));
//console.log($(this).siblings("input").attr('id'));
var found = false;
$(this).siblings("input").each(function (i, name) {
// Check if field is empty or not
console.log(name);
if (!found && jQuery(name).val() == '') {
alert('Please enter value')
found = true;
};
});
return !found;
});
Fiddle

Related

Jquery Validation in CkEditor

I have seen this example and applied it in my code yet nothing worked, its not working.
Referral ans-1
Referral ans-2
I need to apply jquery validation in ckeditor and I have seen all those past examples even I have mentioned those links above, by doing that step my validation is still not working.
Here is my HTML Code
<div class="elementbox">
<label class="form-label">Content<span class="required">*</span></label>
<div class="controls">
<textarea name="content_body" id="content_body" rows="10" cols="80"><?php echo $content_body; ?></textarea>
</div>
</div>
<script>
var url = "<?php echo base_url(); ?>";
CKEDITOR.replace( 'content_body',{
//extraPlugins: 'imageuploader'
} );
</script>
My Jquery validation code
$("#add_content_pages").validate({
ignore: [],
debug: false,
rules: {
title: {
required: true
},
content_id: {
required: true
},
content_body:{
required: function()
{
CKEDITOR.instances.content_body.updateElement();
}
}
},
messages: {
title: {
required: "Please enter Title"
},
content_id: {
required: "Please Select Content Type"
},
content_body: {
required: "Please enter Content"
}
},
errorPlacement: function (error, element) {
var attr_name = element.attr('name');
if (attr_name == 'type') {
error.appendTo('.type_err');
} else {
error.insertAfter(element);
}
}
});
Any Solution what I am missing?
please check this code
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.15.0/jquery.validate.min.js"></script>
<script src="https://cdn.ckeditor.com/4.6.2/standard/ckeditor.js"></script>
then html form
<form action="" method="post" id="check_form">
<div class="elementbox">
<label class="form-label">Content<span class="required">*</span></label>
<div class="controls">
<textarea name="content_body" id="content_body" rows="10" cols="80"></textarea>
<div id="error_check_editor"></div>
</div>
</div>
<script>
CKEDITOR.replace('content_body');
</script>
<br/>
<input name="submit" type="submit" value="Submit" class="button" id="submit"/>
</form>
then script
<script>
$.validator.addMethod("check_ck_add_method",
function (value, element) {
return check_ck_editor();
});
function check_ck_editor() {
if (CKEDITOR.instances.content_body.getData() == '') {
return false;
}
else {
$("#error_check_editor").empty();
return true;
}
}
$(document).ready(function () {
$("#check_form").validate(
{
ignore: [],
debug: false,
errorPlacement: function (error, element) {
if (element.attr("name") == "content_body") {
error.insertAfter(element);
}
},
rules: {
content_body: {
check_ck_add_method: true
}
},
messages: {
content_body: {}
}
});
});
</script>

jQuery Validation - Remote function with additional data

I am having issues with validating some data.
I want to check if someone has reviewed a company before by checking for the company_id and the logged in users account_number in my reviews table.
The code I currently has doesn't ever seem to find anything in the reviews table so doesn't warn people they can't submit another review.
Your help to get this working is much appreciated.
Here is the code I have so far:
Form
<form name="review" id="review" method="post" action="/db_processing/reviews/process-reviews.php">
<input type="hidden" value="<?php echo($results['company_id']) ?>" name="company_id" />
<input type="hidden" value="<?php echo($_SESSION["ID"]) ?>" name="account_number" />
<p class="cs-threequarter">
<b>Comments:</b><br>
<textarea name="comments" style="width:95%; height: 150px"></textarea>
</p>
<p class="cs-quarter">
<b>Rating:</b>
<span class="star-rating">
<input type="radio" name="rating" value="1"><i></i>
<input type="radio" name="rating" value="2"><i></i>
<input type="radio" name="rating" value="3"><i></i>
<input type="radio" name="rating" value="4"><i></i>
<input type="radio" name="rating" value="5"><i></i>
</span>
</p>
<p><input class="cs-btn cs-red" name="submit" type="submit" value="Submit Review!"></p>
<div class="cs-container"></div>
<div class="cs-error-note" id="cs-error-note3"></div>
</form>
<script src="/js/validation/reviewval.js"></script>
jQuery Validation Script
$(document).ready(function () {
$('#review').validate({
errorLabelContainer: "#cs-error-note3",
wrapper: "li",
ignore: "not:hidden",
rules: {
comments: {
required: true
},
account_number: {
required: true,
remote: {
url: "/db_processing/reviews/check-account.php",
type: "post",
data: {
company_id: function() {
return $("#company_id").val();
}
}, }
},
rating: {
required: true
}
},
messages: {
comments: {
required: "Please enter some comments."
},
account_number: {
required: "You must be logged in to review.",
remote: "You have already reviewed this company."
},
rating: {
required: "Please select a rating."
}
},
submitHandler: function(form) {
form.submit();
}
});
});
Check-account.php
<?php
require('../../../private_html/db_connection/connection.php');
$conn = new PDO("mysql:host=$servername; dbname=$dbname", $username, $password);
if(isset($_POST['account_number'])) {
$account_number = $_POST['account_number'];
$compid = $_POST['company_id'];
$query = $conn->prepare("SELECT account_number FROM reviews WHERE account_number =$account_number && company_id =$compid");
$query->execute();
$rows = $query->fetchAll();
$total_rows = count($rows);
if( $total_rows > 0 ){
echo 'false';
} else {
echo 'true';
}
}
?>
Validation code working fine, there is no problem expect unnecessary comma ,. remove it, Not all browsers are very forgiving.
$(document).ready(function () {
$('#review').validate({
errorLabelContainer: "#cs-error-note3",
wrapper: "li"
ignore: "not:hidden",
rules: {
comments:
required: true
},
account_number: {
required: true,
remote: {
url: "/db_processing/reviews/check-account.php",
type: "post",
data: {
company_id: function() {
return $("#company_id").val();
}
}, //<-----Remove this, it's unnecessary
}
},
rating: {
required: true
}
},
messages: {
comments: {
required: "Please enter some comments."
},
account_number: {
required: "You must be logged in to review.",
remote: "You have already reviewed this company."
},
rating: {
required: "Please select a rating."
}
},
submitHandler: function(form) {
form.submit();
}
});
});
HTML
The problem is here, because of it validation and query both failing.
<input type="hidden" value="<?php echo($results['company_id']) ?>" name="company_id" />
assign id to this input because you are fetching it's value with id selector in validation script here return $("#company_id").val(); so it will be
<input type="hidden" value="<?php echo($results['company_id']) ?>" name="company_id" id="company_id" />
last in PHP
put quotes ' around variables inside query, rest is all good and working.
$query = $conn->prepare("SELECT account_number FROM reviews WHERE account_number = '$account_number' && company_id = '$compid'");

jQuery Ajax Post - Form data is not submitted correctly

I have this form
<form method="post" name="addreply" id="addreply">
<input type="hidden" name="pmid" id="pmid" value="">
<textarea rows="10" cols="5" name="message" id="message" placeholder="Write your message..."></textarea>
<input type="submit" class="butt green" value="Send">
</form>
This is the jQuery code that is called when the form is submitted:
$(function() {
$('#addreply').submit(function(){
$('#status').removeClass().addClass('alert info').html('Loading...').fadeIn();
$.post(
'/index.php?i=pm&p=r',
$('form').serialize(),
function (data) {
proccessData(data);
}
);
return false;
});
});
function proccessData (data) {
$('#status').hide().html('');
if(data=='success'){
$("#post").append('<li class="current-user"><img width="30" height="30" src="<?php echo $userdata['avatar'] ?>"><div class="bubble"><a class="user-name"><?php echo $userdata['username']; ?></a><p class="message">'+ $("#message").val() +'</p><p class="time"></p></div></li>');
$('#message').val('');
$(".widget-content").animate({ scrollTop: $('.widget-content')[0].scrollHeight}, 1000);
}
else {
$('#status').removeClass().addClass('alert error').html(data).fadeIn();
}
}
And this is the PHP code that is being posted:
if($_POST)
{
$replyPrivateMessage = $privateMessage->replyMessage();
switch($replyPrivateMessage)
{
case 1:
$error = 'The entered text is either too short or too long.';
$stop = true;
break;
case 2:
$error = 'Unexpected error.';
$stop = true;
break;
//If no error = success.
case 100:
die('success');
break;
}
die($error);
}
So the problem is that when I submit the form, I receive data "success"
Although, it just prints "success" using this:
$('#status').removeClass().addClass('alert error').html(data).fadeIn();
Where it should be using:
if(data=='success'){
$("#post").append('<li class="current-user"><img width="30" height="30" src="<?php echo $userdata['avatar'] ?>"><div class="bubble"><a class="user-name"><?php echo $userdata['username']; ?></a><p class="message">'+ $("#message").val() +'</p><p class="time"></p></div></li>');
$('#message').val('');
$(".widget-content").animate({ scrollTop: $('.widget-content')[0].scrollHeight}, 1000);
}
I can't seem to locate the issue. Can anyone help me?
You'll need to trim you data, it most likely has some trailing white spaces:
data = $.trim(data);
Or
data = data.trim();
use ajax for this, it is very elegant method
$("#addreply").submit(function(event){
event.preventDefault();
$.ajax({
url:"abc.php",
type:"POST",
data:$(this).serialize(),
success: function(data){
data=data.trim();
alert(data);
},
error: function(data){
data=data.trim();
alert(data);
}
});
});

TypeError: Value does not implement interface HTMLInputElement

I'am trying to post a form using jQuery-ajax, and I'am getting this error on posting the form on click.
TypeError: Value does not implement interface HTMLInputElement
here is my JavaScript code:
$('document').ready(function () {
$('#update').click(function () {
jQuery.post("update_category", {
c_id: c_id,
c_name: c_name,
c_description: c_description
},
function (data, textStatus) {
if (data == 1) {
$('#response').html("Thank You!!..We Will Get Back To You Soon..!!");
$('#response').css('color', 'green');
} else {
$('#response').html("Some Error Occurred");
$('#response').css('color', 'red');
}
});
});
});
my form :
<div id="form">
<form>
<!-- PRONT DROP DOWN HERE !-->
<input type="text" name="c_id" id="c_id" disabled="disble" placeholder="'.strtoupper($r['c_id']).'" value="'.strtoupper($r['c_id']).'" ></input>
<input type="text" name="c_name" id="c_name" disabled="disble" placeholder="'.strtoupper($r['c_name']).'" value="'.strtoupper($r['c_name']).'"></input>
<textarea rows="4" class="field span10" name="c_description" id="c_description" disabled="disble" placeholder="Description">'.strtoupper($r['c_description']).'</textarea>
</form>
</div>
This error can be generated if you send a jQuery object in an ajax request.
So in your situation, it's likely that one of c_id, c_name, or c_description is a jQuery object representing an input field rather than the .val() value of the input element.
Your form containing server side PHP code within HTML code.
PHP code should be written as below.
<input type="text" name="c_id" id="c_id" disabled="disble" placeholder="<?php echo strtoupper($r['c_id']) ; ?> " value="<?php echo strtoupper($r['c_id']) ; ?> " ></input>
Also check the below link for Jquery reference.
Javascript: TypeError: Value does not implement interface FormData
try this
jQuery.post
use this
$.post
here full code
$(document).ready(function () {
$('#update').click(function () {
$.post("update_category", {
c_id: c_id,
c_name: c_name,
c_description: c_description
},
function (data, textStatus) {
if (data == 1) {
$('#response').html("Thank You!!..We Will Get Back To You Soon..!!");
$('#response').css('color', 'green');
} else {
$('#response').html("Some Error Occurred");
$('#response').css('color', 'red');
}
});
});
});
Hope it will help
Check the below code. span or div with id="response" is missing in your code and replace jquery.post by $.post. Give the file name update_category with the extension
<html>
<head>
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$('document').ready(function(){
var c_id = '1', c_name = 'test', c_description = 'testing';
$('#update').click(function(){
$.post("update_category.php", {
c_id:c_id,
c_name: c_name,
c_description: c_description
}, function(data){
if(data == 1){
$('#response').html("Thank You!!..We Will Get Back To You Soon..!!");
$('#response').css('color','green');
}
else
{
$('#response').html("Some Error Occurred");
$('#response').css('color','red');
}
});
});
});
</script>
</head>
<body>
<div id="form">
<form>
<!-- PRONT DROP DOWN HERE !-->
<input type="text" name="c_id" id="c_id" placeholder="" value="" />
<input type="text" name="c_name" id="c_name" placeholder="" value="" />
<textarea rows="4" class="field span10" name="c_description" id="c_description" placeholder="Description"></textarea>
<input type="button" id="update" value="Update" />
<span id="response"></span> <!-- This is missing in your form -->
</form>
</div>
</body>
</html>
Try to use value inside variables
$('document').ready(function () {
$('#update').click(function () {
jQuery.post("update_category", {
c_id: c_id.val(),
c_name: c_name.val(),
c_description: c_description.val()
},
function (data, textStatus) {
if (data == 1) {
$('#response').html("Thank You!!..We Will Get Back To You Soon..!!");
$('#response').css('color', 'green');
} else {
$('#response').html("Some Error Occurred");
$('#response').css('color', 'red');
}
});
});

How to combine jquery form validation with codeigniter?

Hello guys I have a little problem. My problem is I want to use jquery form validation plugin together with codeigniter. As of now I can validate my form using jquery validation rules. Like checking the required fields, checking length of input, checking valid email, etc... But for checking the availability of the data in my database I always got an error. I used the remote function but I can't validate my form. Here's my code I hope you can help me.
addNewItem.php
<script type="text/javascript">
(function($,W,D){
var JQUERY4U = {};
JQUERY4U.UTIL =
{
setupFormValidation: function()
{
$("#login-form").validate({
rules: {
name: {
required: true,
remote: {
type: 'post',
url: <?php echo site_url('category_model/checkName'); ?>,
data: {
'name': $('#name').val()
},
datatype: 'json'
}
},
description: {
required: true
}
},
messages: {
username: {
remote: "Category name already taken!"
}
description: "Please provide a description for category!"
}
});
}
}
//when the dom has loaded setup form validation rules
$(D).ready(function($) {
JQUERY4U.UTIL.setupFormValidation();
});
})(jQuery, window, document);
</script>
<div>
<?php $attr = array('class'=>'form-signin','id'=>'login-form','novalidate'=>'novalidate'); ?>
<?php echo form_open('category_controller/insertItem',$attr); ?>
<h2 class="form-signin-heading"></h2>
<h5 style="font-weight: normal;">Category Name:</h5>
<input type="text" class="input-block-level" placeholder="Category Name" name="name" autofocus="autofocus" value="" required="requried" id="name" />
<h5 style="font-weight: normal;">Desciption</h5>
<input type="text" class="input-block-level" placeholder="Description" name="description" value="" required="required" id="description" />
<br />
<div align="right">
<input type="submit" value="OK" class="btn btn-large btn-primary" />
<input type="button" value="CANCEL" class="btn btn-large btn-primary" name='cancel' />
</div>
<?php echo form_close(); ?>
my model (category_model/checkName)
public function checkName(){
$catname = ucwords($this->input->post('name'));
$validate = "SELECT COUNT(*) AS valid FROM sales_category WHERE salescatname = '{$catname}'";
$testvalidate = $this->db->query($validate);
foreach($testvalidate->result_array() as $row){
$is_valid = $row['valid'];
}
if($is_valid > 0){
return TRUE;
}else{
return FALSE;
}
}
Try changing the following
public function checkName()
{
$catname = ucwords($this->input->post('name'));
$validate = "SELECT COUNT(*) AS valid FROM sales_category
WHERE salescatname = '{$catname}'";
$testvalidate = $this->db->query($validate);
foreach($testvalidate->result_array() as $row){
$is_valid = $row['valid'];
}
echo $is_valid;
}

Categories