5
AJAX के माध्यम से जानकारी जमा करने में समस्या है।इनपुट के साथ अजाक्स मुद्दा, textarea धुंध
उदाहरण के लिए 20 पंक्तियां हैं। पंक्ति पर क्लिक करें और यह सेवाओं के बारे में सभी जानकारी खुलता है।
$('tr').click(function() {
var servicesUpdateId = $(this).attr('data');
$("#"+servicesUpdateId).css({"display":"block", 'opacity':'0'}).animate({left: '0',opacity: '1',});
// save form class for ajax submit
localStorage.setItem("formId", servicesUpdateId);
});
यहाँ एचटीएमएल:
<tbody>
<?php
$allServices = Services::where('user_id', $mainUser->id);
foreach($allServices as $oneServices) {
?>
<tr class="services-table-hover" data="services_<?php echo $oneServices->id; ?>">
<td> <div class="services-color"></div> <img src="/assets/images/provider_img2.png" alt=""> </td>
<td class="title-name"> <?php echo $oneServices->name; ?> </td>
<td> <?php echo $oneServices->description; ?> </td>
<td> <?php echo $oneServices->duration; ?> mins </td>
<td> <?php echo $oneServices->currency; ?> <?php echo $oneServices->price; ?> </td>
<td style="line-height: 50px;"> <i class="icon-arrow-right"></i> </td>
</tr>
<?php } ?>
तब जानकारी के साथ अपने div
<?php foreach($allServices as $onesServices) { ?>
<div id="services_<?php echo $onesServices->id; ?>">
<div class="portlet light minHeigh staff-hover">
<form action="" method="post" class="services_<?php echo $onesServices->id; ?>">
<div class="portlet-title tabbable-line">
<a class="goBackOne"><i class="icon-arrow-left"></i></a><h3 style="display: inline-block;"><?php echo $lang['SERVICES_LEFT_MENU_ALL']; ?></h3>
</div>
<div class="col-sm-7">
<div class="portlet-body">
<div class="tab-content">
<div class="tab-pane active" id="portlet_tab1">
<div class="form-body input-smaller">
<div class="form-group">
<label class="col-md-3 control-label" for="form_control_1"><img class="imgs" src="/assets/images/provider_img2.png" alt=""></label>
<div class="col-md-9">
<input type="text" class="form-control" name="update_service_name" style="margin-bottom:10px; font-size: 26px; font-weight: 600;" value="<?php echo $onesServices->name; ?>">
<textarea name="update_service_description" id="" cols="30" rows="10" class="form-control" style="margin-bottom:10px;" placeholder="Description"><?php echo $onesServices->description; ?></textarea>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label" for="form_control_1"><?php echo $lang['SERVICES_INSIDE_COST']; ?></label>
<div class="col-md-9">
<input type="text" class="form-control" name="update_service_price" value="<?php echo $onesServices->price; ?>">
</div>
</div>
<div class="clearfix"></div>
<div class="form-group">
<label class="col-md-3 control-label" for="form_control_1"><?php echo $lang['SERVICES_INSIDE_TIME']; ?></label>
<div class="col-md-9">
<input type="text" class="form-control" name="update_service_duration" value="<?php echo $onesServices->duration; ?>">
</div>
</div>
<div class="clearfix"></div>
<div class="form-group">
<?php
$servicesCat = $onesServices->service_categories_id;
$servicesCat = json_decode($servicesCat);
?>
<label class="col-md-3 control-label" for="form_control_1"><?php echo $lang['SERVICES_INSIDE_LIST']; ?></label>
<div class="col-md-9">
<select id="multiple2" name="update_services_category" class="form-control select2-multiple" multiple placeholder="Select categories">
<?php foreach($servicesCategories as $onCategory) { ?>
<?php if(in_array($onCategory->id, $servicesCat)) { ?>
<option value="<?php echo $onCategory->id; ?>" selected><?php echo $onCategory->name; ?></option>
<?php } else { ?>
<option value="<?php echo $onCategory->id; ?>"><?php echo $onCategory->name; ?></option>
<?php } ?>
<?php } ?>
</select>
</div>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-5">
<h4><?php echo $lang['SERVICES_INSIDE_PROVIDE']; ?></h4>
<?php
$staffs_eupdate = Staffs::where('id_users', $mainUser->id);
$serviceStaff = ServiceStaffs::find_by_query("SELECT staff_id FROM service_staffs WHERE user_id = '$mainUser->id' AND services_id = '$onesServices->id' ");
$newStaffId = array();
foreach($serviceStaff as $index => $sStaff) {
$newStaffId[$index] = $sStaff->staff_id;
}
foreach($staffs_eupdate as $staff_update) {
?>
<div class="full-services">
<div class="all-services">
<?php if(in_array($staff_update->id, $newStaffId)) { ?>
<div class="all-around all-around-on">
<div class="float-on-left">
<div class="ignore_img"><input type="hidden" name="update_staffs_id[]" value="<?php echo $staff_update->id; ?>"></div>
<?php echo $staff_update->name; ?>
</div>
</div>
<?php } else { ?>
<div class="all-around all-around-non">
<div class="float-on-left">
<div class="ignore_img"><input type="hidden" name="update_staffs_id[]" value="<?php echo $staff_update->id; ?>"></div>
<?php echo $staff_update->name; ?>
</div>
</div>
<?php } ?>
</div>
</div>
<?php } ?>
</div>
</form>
</div>
मैं सा स्थानीय स्टोरेज में विंग क्लास। और फिर उपयोगकर्ता है कि मैदान के बाहर संपादित करता है क्षेत्र में मूल्य और वह बाहर, मैं ajax
$('.'+localStorage.getItem("formId")+' input, .'+localStorage.getItem("formId")+' textarea').blur(function(event) {
var updateStaffId = $("."+localStorage.getItem("formId")+" .all-around-on input[name='update_staffs_id[]']").map(function(){return $(this).val();}).get();
var updateCategoriesId = $("."+localStorage.getItem("formId")+" select[name=update_services_category] option:selected").map(function(){return $(this).val();}).get();
var formData = {
'from' : 'serviceUpdate',
'user_id' : '<?php echo $mainUser->id; ?>',
'services_id' : localStorage.getItem("formId"),
'update_services_name' : $('.'+localStorage.getItem("formId")+' input[name=update_service_name]').val(),
'update_services_description' : $('.'+localStorage.getItem("formId")+' textarea[name=update_service_description]').val(),
'update_services_price' : $('.'+localStorage.getItem("formId")+' input[name=update_service_price]').val(),
'update_services_duration' : $('.'+localStorage.getItem("formId")+' input[name=update_service_duration]').val(),
'update_services_category' : updateCategoriesId,
'update_services_staff' : updateStaffId
};
$.ajax({
type : 'POST',
url : 'ajax/ServicesAjax.php',
data : formData,
dataType : 'json',
encode : true
})
// using the done promise callback
.done(function(data) {
if(data['success'] == true) {
toastr.success("Information updated successfuly!", "Services");
}
})
// using the fail promise callback
.fail(function(data) {
// show any errors
// best to remove for production
console.log(data);
});
// stop the form from submitting the normal way and refreshing the page
event.preventDefault();
});
साथ वह जानकारी अपडेट समस्या यह है कि अंतिम पंक्ति के साथ ही काम करता है किया गया है। पहली पंक्ति, दूसरा, 5, 10 तब जानकारी खोलती है और फ़ील्ड मान संपादित करती है, धुंध पर यह काम नहीं करती है। लेकिन अंतिम पंक्ति पूरी तरह से काम करता है। समस्या कहां हो सकती है?
UPDATED
समस्या का समाधान, मैं $('tr').click में मेरे ajax जोड़ सकते हैं और var servicesUpdateId = $(this).attr('data'); साथ localStore बदल जाते हैं। शायद समस्या स्थानीय स्टोर था। लेकिन कंसोल में, यह हमेशा सही मूल्य दिखाता है।
क्या आप सुनिश्चित हैं कि आपकी आईडी अद्वितीय हैं –
रूपों में कक्षा है, सभी वर्ग अद्वितीय हैं। मैंने आईडी, एक ही समस्या के साथ परीक्षण किया। –
आप स्थानीय संग्रहण में क्यों स्टोर कर रहे हैं? क्यों न सिर्फ चयनित वर्ग या अद्वितीय आईडी के साथ AJAX को बुलाओ? स्टोर करने का कोई विशिष्ट कारण है? –