i just want to choose data again after select2 with select2, but not showing the data
loadUser();
function loadUser() {
$('#wg').empty();
$.ajax({
url: "<?php echo site_url('administrator/admin/getWg'); ?>",
type: 'GET',
dataType: 'JSON',
}).done(function(data) {
console.log('data: ', data);
$.each(data, function(i, item) {
$('#wg').append($('<option>', {
value: item.workgroup,
text: item.workgroup
}));
});
});
$('#wg').change(function() {
wg = $(this).val(),
$.ajax({
url: '<?php echo site_url("administrator/admin/getWg2"); ?>/' + wg,
dataType: 'JSON',
type: 'GET',
}).done(function(data) {
console.log('use: ', data);
$('#name').val(data.name);
});
});
}
but, if i use the input data without the select2 the data showing but only the first array, how to showing the all data ?
<div class="col-md-6">
<label for="wg">Workgroup</label>
<select class="form-control select2" id="wg" name="wg"></select>
</div>
<div class="col-md-6">
<label for="name">Name</label>
<input class="form-control select2" id="name" name="name">
</div>
just how to use the select2 twice.
Related
Im getting a empty file response when sending the formData in ajax, It has a fileupload and some input fields. I get the response in input fields but in file upload its empty. See picture below for code.
<div class="form-group">
<label for="attachments" class="control-label col-xs-1" style="padding: 0px 0px;">Add attachments</label>
<div class="col-lg-8">
<input type="file" name="attachments[]" id="attachments" class="custom-file-input" accept="application/pdf" multiple>
</div>
<div class="col-lg-8">
<input type="text" name="name_file" id="name_file">
</div>
$("#acpl_submit").on("submit", function() {
var formData = new FormData(this);
formData.append("test", "test");
$.ajax({
type: 'POST',
// enctype: 'multipart/form-data',
url: URL,
data: formData,
processData: false,
contentType: false,
cache: false,
success: function (data) {
console.log(data);
},
error: function (data)
{
console.log('Error:', data);
}
});
return false;
});
PHP file, returning the POST data for checking.
public function save_accomp() {
return response()->json(request()->all());
}
I want to send section option value with ajax but only selection
and checkbox
the problem is that section and checkbox post undifined
thanx advanced
php code
<?php
$paramateres = new ParametresApp();
$paramateres->getparametres();
$max_pages_nbr = $paramateres->max_pages_nbr;
$idle_deconnexion = $paramateres->idle_deconnexion;
$show_chat = $paramateres->show_chat;
?>
html code
<form id="formparametres" class="form-row row shadow bg-white border row p-5 "
method="post">
<div class="form-check col-3 col-lg-3 ">
<input name="show_chat" id="show_chat" type="checkbox"
class="form-check-input" value="<?php echo $show_chat; ?>"
<?php if ($show_chat == 1) {
echo 'checked="true" ';
}
?>
<label class="form-check-label"
for="show_chat"> Autoriser messenger </label>
</div>
<div class="col-3 col-lg-3">
<label class="form-control-label">idle deconexion</label>
<input name="idle_deconnexion" class="form-control"
value="<?php echo $idle_deconnexion; ?>" required>
</div>
<div class="input-wrapper col-4 col-lg-4">
<label class="form-control-label">max_pages_nbr</label>
<select name="max_pages_nbr" class="form-control" required>
<?php echo '<option value="'.$max_pages_nbr.'">'.$max_pages_nbr.'</option>
<option value="5">5</option>
<option value="10">10</option>
<option value="15">15</option>
<option value="20">20</option>
<option value="25">25</option>';?>
</select>
</div>
</form>
jquery code
$("form").submit(function (event) {
event.preventDefault();
var formData =
'show_chat=' + $('input[name=show_chat]').val() +
'&idle_deconnexion=' + $('input[name=idle_deconnexion]').val() +
'&max_pages_nbr=' + $('section[name=max_pages_nbr]').val() ;
$.ajax({
url: "src/admins/inc/save_parametres.inc.php",
method: "POST",
data: formData, // serializes the form's elements.
cache: false,
success: function (data) {
alert(data);
}
});
Try this
$("form").submit(function (event) {
event.preventDefault();
var formData = {'show_chat' : $('input[name=show_chat]').val(), 'idle_deconnexion' : $('input[name=idle_deconnexion]').val(), 'max_pages_nbr' : $('section[name=max_pages_nbr]').val() };
$.ajax({
url: "src/admins/inc/save_parametres.inc.php",
method: "POST",
dataType: 'json',
data: formData, // serializes the form's elements.
cache: false,
success: function (data) {
alert(data);
}
});
Hope this will help you.
i have solveur thanx for all
jquery
$(document).ready(function () {
$(':checkbox').change(function () {
if ($(this).attr("value") == 1) {
$(this).attr("value", 0)
} else {
$(this).attr("value", 1)
}
});
$("form").submit(function (event) {
event.preventDefault();
var formData =
'show_chat=' + $('#show_chat').attr("value") +
'&idle_deconnexion=' + $('input[name=idle_deconnexion]').val() +
'&max_pages_nbr=' + $('#max_pages_nbr option:selected').text() ;
$.ajax({
url: "src/admins/inc/save_parametres.inc.php",
method: "POST",
data: formData, // serializes the form's elements.
cache: false,
success: function (data) {
alert(data);
}
});
});
});
in may page src/admins/inc/save_parametres.inc.php
<?php
if (isset($_POST)){
$show_chat= $_POST['show_chat'];
$idle_deconnexion= $_POST['idle_deconnexion'];
$max_pages_nbr= $_POST['max_pages_nbr'];
$sql = " update dms_parametres set parm_value=".$show_chat ." where parm_name='show_chat';
update dms_parametres set parm_value='" . $idle_deconnexion . "' where parm_name='idle_deconnexion';
update dms_parametres set parm_value='" . $max_pages_nbr . "' where parm_name='max_pages_nbr';
";
if (!$parametres->connect()->multi_query($sql)) {
echo $parametres->connect()->error;
} else {
echo 'sucsess';
}
}
?>
There are 2 drop down list:
Project
Plot Details
My Question is: Once Project is selected then Plot Details Get Populated properly but, when Plot Details of Dropdown is get select then Chrome hangs up.
To continue, I have to refresh the page. I want the Plot Details(drop down) value to call another ajax call.
javascript
$(document).ready(function() {
$('.get_member_name').live('change', function() {
alert('hello')
var project = $('#project').val();
var plot_details = $('#plot_details').val();
var base_url = $('#base_url').val();
if (project && plot_details) {
$.ajax({
type: "POST",
url: base_url + "admin/get_member_name",
data: {'category': category},
dataType: "html",
success: function(result) {
alert(result)
}
})
}
});
})
HTML
<div class="form-group">
<label class="col-md-3 control-label" for="inputSuccess">
Plot Details :
</label>
<div class="col-sm-9">
<select class="form-control get_member_name" name="plot_details" required="required" id="plot_details">
<option value="" id="opp12">Select Plot</option>
</select>
</div>
</div>
PHP
public function get_plot_details() {
if ($this->session->userdata('role_id') == 1) {
$data['record'] = $this->db->get_where('plot_details', array('project_id' => $this->input->post('project')))->result();
print_r($this->load->view('admin/ajax_data', $data, TRUE));
} else {
redirect('home/login');
}
}
View Page
if (isset($record) && $record != NULL && $record != "") {
foreach ($record as $m) {
echo '<option value="' . $m->id . '"> ' . $m->plot_number . ' Area ' . $m->total_area . '</option>';
}
}
I could see you have used 'project' in your php to fetch the records from DB. But in your ajax you are passing the request data 'category'. Might be this one is causing issue. So instead of
$.ajax({
type: "POST",
url: base_url + "admin/get_member_name",
data: {'category': category},
dataType: "html",
success: function(result) {
alert(result)
}
})
use
$.ajax({
type: "POST",
url: base_url + "admin/get_member_name",
data: {'project': project},
dataType: "html",
success: function(result) {
alert(result)
}
})
I am trying to display an <input> value base on a selected value of a dropdown list using jquery ajax.
This is the markup for my form -
<div class="form-group">
<label for="" class="control-label">District</label>
<div class="element">
<select class="form-control" id="district">
<?php echo $option; ?>
</select>
</div>
</div>
<div class="form-group">
<label for="" class="control-label">Province</label>
<div class="element">
<input type="text" class="form-control province" placeholder="Province" value="" disabled>
</div>
</div>
Just I need to display province input's value When selecting a district from above dropdown.
This is my ajax code -
$("#district").change(function(event) {
var id = $("#district").val();
//alert(data);
/* Send the data using post and put the results in a div */
$.ajax({
url: "./includes/process_province.php",
type: "post",
data: id,
success: function(){
alert('Submitted successfully');
},
error:function(){
alert("failure");
}
});
// Prevent default posting of form
event.preventDefault();
});
When I selecting a district from the dropdown its going to this alert alert('Submitted successfully');. But I am not sure how to display PHP processing value in my text field.
This is my PHP code from proccess_province.php
// Require the configuration file before any PHP code:
require('./configuration.inc.php');
// Need the database connection:
require('../'.MYDB);
if(isset($_POST['id'])) {
$province_id = (int)$_POST['id'];
// Select exsiting data for an user and display them in the form for modify
$prep_stmt = " SELECT province
FROM province
WHERE province_id = ?";
$stmt = $mysqli->prepare($prep_stmt);
if ($stmt) {
// Bind "$userId" to parameter.
$stmt->bind_param('i', $province_id);
// Execute the prepared query.
$stmt->execute();
$stmt->store_result();
// get variables from result.
$stmt->bind_result($province);
// Fetch all the records:
$stmt->fetch();
$db_province = filter_var($province, FILTER_SANITIZE_STRING);
//echo $province;
} else {
echo 'Database error';
}
echo $db_province;
}
Hope somebody may help me out.
Thank you.
Since you echo the value of the province in the ajax file, you need to set the value based on that response. Try this:
$.ajax({
url: "./includes/process_province.php",
type: "post",
data: id,
success: function(data){
$('#province').val(data);
alert('Submitted successfully');
},
error:function(){
alert("failure");
}
});
And your markup:
<div class="form-group">
<label for="" class="control-label">Province</label>
<div class="element">
<input id="province" type="text" class="form-control province" placeholder="Province" value="">
</div>
</div>
If you want to set the value of input same as your select option value, you can change your success callback to this-
$.ajax({
url: "./includes/process_province.php",
type: "post",
data: id,
success: function(){
$('.province').val(id);
},
error:function(){
alert("failure");
}
});
Or, if you are bothered about the ajax response and populate the value of input based on the ajax response, you can access the data being returned as follows-
$.ajax({
url: "./includes/process_province.php",
type: "post",
data: id,
success: function(data){
// access data here and do something
},
error:function(){
alert("failure");
}
});
Add to php file -
$db_province = filter_var($province, FILTER_SANITIZE_STRING);
echo json_encode($db_province);
at the end.
On the html page -
<input type="text" id="province" class="form-control province" placeholder="Province" value="" readonly>
then set the response to the field value -
success: function(response){
$('#province').val(response)
alert('Submitted successfully');
},
In the the form change the code as,
<div class="form-group">
<label for="" class="control-label">Province</label>
<div class="element">
<input type="text" id="province" class="form-control province" placeholder="Province" value="">
</div>
</div>
In script section use,
<script type="text/javascript">
$("#district").change(function(event) {
var id = $("#district option:selected").val();
/* Send the data using post and put the results in a div */
$.ajax({
url: "./includes/process_province.php",
type: "post",
data: {id : id},
dataType: "json",
success: function(){
$('#province').val(data.province);
alert('Submitted successfully');
},
error:function(){
alert("failure");
}
});
// Prevent default posting of form
event.preventDefault();
});
</script>
In the proccess_province.php file, instead of
echo $db_province;
use,
echo json_encode(array('province' => $db_province));
Hope it helps.
i have a problem with finding parent for form in this code:
<li class="comment<?php echo $comment[id]?>">
<div class="comment-content">
<div class="comment-top">
<div class="comment-nme">
<?php echo $comment[name]?>
</div>
<div class="comment-dt">
<?php echo $comment[dt]?>
</div>
</div>
<div class="comment">
<?php echo $comment[comment]?>
</div>
<a class="reply" href="#comment<?php echo $comment[id]?>">Ответить</a>
</div>
<div class="answer-form">
<form method="post" name="answer-form" class="ans">
<textarea class="comment-textarea" name="comment"></textarea>
<div class="a-comment-inputs">
<input type="hidden" name="parent_id" value="<?php echo $comment[id]?>">
<input type="hidden" name="status" value="new">
<div class="a-comment-name">
Имя</br>
<input type="name" name="name" class="a-comment-name">
</div>
<div class="a-comment-email" >
Eмейл</br>
<input type="email" class="a-comment-email" name="email">
</div>
</div>
<div class="comment-apply">
<button value="submit" onclick="return sendDataChild();" class="answer-but">Добавить</button>
</div>
</form>
</div>
<?php if($comment[childs]){ ?>
<ul class="commentsRoot<?php echo $comment[id]?>">
<?php echo commentsString($comment[childs]) ?>
</ul>
<?php } ?>
</li>
i use this jQuery function:
function sendDataChild() {
var form = $('FORM[name=answer-form]');
var data = form.serialize();
$.ajax({
type: "POST",
url: "req.php",
dataType: "json",
data: data,
cache: false,
success: function (data) {
form[0].reset();
},
error: function (xhr, str) {
alert('Возникла ошибка: ' + xhr.responseCode);
}
//$("#messageModalDialog").text(resultStat).show();
});
return false;
};
but it select every form that find on button click.
Can somebody advise how to solve it?
one possible solution
<button value="submit" onclick="return sendDataChild(this);" class="answer-but">Добавить</button>
then
//pass the clicked button reference then find the parent form of the button
function sendDataChild(btn) {
var form = $(btn).closest('FORM[name=answer-form]');
var data = form.serialize();
$.ajax({
type: "POST",
url: "req.php",
dataType: "json",
data: data,
cache: false,
success: function (data) {
form[0].reset();
},
error: function (xhr, str) {
alert('Возникла ошибка: ' + xhr.responseCode);
}
//$("#messageModalDialog").text(resultStat).show();
});
return false;
};
Bind submit event on the form and pass the object to the form object to your method
$(document).ready(function(){
$("form[name='answer-form']").on('submit', function(){
sendDataChild($(this));
});
});
function sendDataChild(form) {
var data = form.serialize();
$.ajax({
type: "POST",
url: "req.php",
dataType: "json",
data: data,
cache: false,
success: function (data) {
form.reset();
},
error: function (xhr, str) {
alert('Возникла ошибка: ' + xhr.responseCode);
}
//$("#messageModalDialog").text(resultStat).show();
});
return false;
};