PHP Ionic Angular Phonegap AJAX Javascript CSS MySQL jQuery Forum


สอบถามการ insert ข้อมูลแบบ array แถวละ 1 ข้อมูลครับ

ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา สอบถามการ insert ข้อมูลแบบ array แถวละ 1 ข้อมูลครับ

สอบถามการ insert ข้อมูลแบบ array แถวละ 1 ข้อมูลครับ

ผมลองดูบทความ https://www.ninenik.com/content.php?arti_id=806

แต่ยังไม่สามารถบันทึกค่าแต่ละแถวได้ มันเข้าแค่อันเดียวครับ



ส่วนฟอร์มครับ

<div class="modal fade" id="add_new_record_modal_3" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">เพิ่มข้อมูลใหม่</h4>
			</div>
            <div class="modal-body">
			
				<form name="FormData" method="post" action="" >
					<div class="wrapper">
						<div class="row">
							<div class="col-md-7"><label for="first_name">ชื่อบริษัท/ผู้ประกอบการ</label>
								<!-- <input type="text" name="input_array_name[]" autofocus="autofocus" class="form-control text-uppercase typeahead" autocomplete="off" placeholder="ค้นหาชื่อบริษัท...." />-->
							</div>
							<div class="col-md-2"><label for="co">C/O</label>
								<!-- <input class="form-control type="text" id="spinEdit" /> -->
							</div>
							<div class="col-md-2"><label for="cf">C/F</label>
								<!-- <input class="form-control type="text" id="spinEdit" /> -->
							</div>
							
						</div>	
						
					</div>
					<button class="btn btn-default add_fields">เพิ่มรายการ</button>
				</form>
				
				<script>
					//Add Input Fields
					$(document).ready(function() {
						var max_fields = 10; //Maximum allowed input fields 
						var wrapper    = $(".wrapper"); //Input fields wrapper
						var add_button = $(".add_fields"); //Add button class or ID
						var x = 1; //Initial input field is set to 1
						
						//When user click on add input button
						$(add_button).click(function(e){
							e.preventDefault();
							//Check maximum allowed input fields
							if(x < max_fields){ 
								x++; //input field increment
								//add input field
								$(wrapper).append('<div style="margin-bottom: 10px;">'+
								'<div class="row fieldGroup">'+
								
								'<div class="col-md-7">'+
								'<input type="text" id="company_chamber" name="company_chamber[]" class="form-control text-uppercase typeahead1" autocomplete="off" placeholder="ค้นหาชื่อบริษัท...." /> '+
								'</div>'+
								
								'<div class="col-md-2">'+
								'<div data-trigger="spinner" class="input-group spinner" id="spinner">'+
								  '<input type="text" class="form-control value="1" id="co" data-ruler="quantity">'+
								   '<div class="input-group-btn-vertical">'+
								  '<button class="btn btn-default" type="button" data-spin="up"><i class="fa fa-caret-up"></i></button>'+
								  '<button class="btn btn-default" type="button" data-spin="down"><i class="fa fa-caret-down"></i></button>'+
								  '</div>'+
								'</div>'+
								'</div>'+
								
								'<div class="col-md-2">'+
								'<div data-trigger="spinner" class="input-group spinner" id="spinner">'+
								  '<input type="text" class="form-control value="1" id="cf" data-ruler="quantity">'+
								   '<div class="input-group-btn-vertical">'+
								  '<button class="btn btn-default" type="button" data-spin="up"><i class="fa fa-caret-up"></i></button>'+
								  '<button class="btn btn-default" type="button" data-spin="down"><i class="fa fa-caret-down"></i></button>'+
								  '</div>'+
								'</div>'+
								'</div>'+
								
								
								'<a class="remove_field" href="javascript: void(0)"><i class="glyphicon glyphicon-minus-sign glyphicon-large" style="font-size: 24px; color:#d9534f; padding-top: 5px;"></i></a></div></div>');
								
								$('#spinner:first-of-type')
								  .spinner('delay', 200) //delay in ms
								  .spinner('changed', function(e, newVal, oldVal) {
									// trigger lazed, depend on delay option.
								  })
								  .spinner('changing', function(e, newVal, oldVal) {
									// trigger immediately
								  });
								  
								  $('#spinner:last-of-type')
								  .spinner('delay', 200) //delay in ms
								  .spinner('changed', function(e, newVal, oldVal) {
									// trigger lazed, depend on delay option.
								  })
								  .spinner('changing', function(e, newVal, oldVal) {
									// trigger immediately
								  });
								
								
								$('.typeahead1:last').typeahead({
									autoSelect: true,
									minLength: 2,
									//delay: 200,
									hint: true,
									highlight:true,
									source: function(query, result)
									{
										$.ajax({
											url:"fetch.php",
											method:"POST",
											data:{query:query},
											
											dataType:"json",
											success:function(data)
											{
												result($.map(data, function(item){
													return item;
												}));
											}
										})
									}
								});
								
							}
						});
						
						//when user click on remove button
						$(wrapper).on("click",".remove_field", function(e){ 
							e.preventDefault();
							$(this).parent('div').remove(); //remove inout field
							x--; //inout field decrement
						})
					});
				</script>
				
			</div>
			
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">ยกเลิก</button>
                <button id="chamber_submit" type="button" class="btn btn-primary" onclick="addRecord3()">เพิ่มข้อมูล</button>
			</div>
		</div>
	</div>
</div>
ส่วนของฟังก์ชั่น
// Add Record
function addRecord3() {
    // get values
    var company_chamber = $("#company_chamber").val();
    var co = $("#co").val();
    var cf = $("#cf").val();
	
    // Add record
    $.post("ajax/addRecord3.php", {
        company_chamber: company_chamber,
        co: co,
        cf: cf
		
		
		}, function (data, status) {
        // close the popup
        $("#add_new_record_modal_3").modal("hide");
		
        // read records again
        readRecords3();
		
		$("#company_chamber").val("");		
		$("#co").val("0");
		$("#cf").val("0");
	});
}
ส่วนของบันทึกข้อมูลครับ
if(isset($_POST['company_chamber']))
	{
		// include Database connection file 
		include("db_connection.php");

		// get values 
		$company_chamber = $_POST['company_chamber'];
		$co = $_POST['co'];
		$cf = $_POST['cf'];
		
		$company = strtoupper($company);
		 
		$query = "INSERT INTO chamber(company_chamber, co, cf) VALUES('$company_chamber', '$co', '$cf')"; //บันทึกการให้คำปรึกษา 
		
		if (!$result = mysql_query($query)) {
	        exit(mysql_error());
	    }
	    echo "1 Record Added!";
	}


โดย:  Pramuan.pao IP: 112.121.130.xxx วันที่: 20-09-2018 เวลา: 08:30:52

คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก


  • ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ


  • ( หรือ สามารถทำการ สมัครสมาชิก และล็อกอิน ด้วย ปุ่ม Log in with Facebook ด้านล่าง )
 ความคิดเห็นที่ 1
ถ้าส่งข้อมูลแบบ ajax เราต้องวนลูปรายการข้อมูลทั้งหมด แล้วส่งไปบันทึก หรือใช้
serialize() ฟังก์ชั่น ส่งไปแบบฟอร์มปกติก็ได้
 
ทบทวนการใช้งาน submit ข้อมูลแบบ ajax และการ reset form http://niik.in/570 


โดย:  Ninenik IP: 183.88.76.xxx วันที่: 20-09-2018
 ความคิดเห็นที่ 2

ขอบคุณมากเลยครับ ผมลองแบบ serialize() ใช้งานได้เรียบร้อยครับ



โดย:  Pramuan.pao IP: 112.121.130.xxx วันที่: 20-09-2018 เวลา: 15:55:41