|
 |
| |
ขอความช่วยเหลือครับ jquery.js ชนกับ autocomplete.js ครับ |
| |
 |
|
|
 |
 |
|
ตอนแรกใช้งาน Jquery ลูกเล่นอื่นๆได้ปกติครับ
แต่พอเมื่อนำ Autocomplete(ตัวที่รองรับภาษาไทย) เข้ามาใช้ ทำให้ชนกันครับ
เมื่อปิดการเรียกใช้ jquery.js ตัว Autocomplete จะทำงาน
แต่เมื่อปิด autocomplete.js ตัว Jquery อื่นๆก็ทำงานได้ปกติครับ
(เปิดใช้ทั้งคู่ Jquery อื่นๆทำงาน แต่ Autocomplete ไม่ทำงาน)
ได้ลองทำการเอา Jquery Version ใหม่มาลองเรียกใช้ แต่ก็ผลก็เหมือนเดิมครับ
ดูได้ที่บรรทัด 16-17-18
ส่วน Script ในการทำงาน Auto Complete อยุ่ที่ บรรทัด 149
( เป็นมือใหม่ อ่อนเรื่อง Jquery มากๆ )
ขอความช่วยเหลือ - คำแนะนำด้วยครับท่านๆเซียนทั้งหลาย
Code (PHP)
<? @session_start(); ?>
<?include 'Administrator/config/ConnectDB.php'; ?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="Mosaddek">
<meta name="keyword" content="FlatLab, Dashboard, Bootstrap, Admin, Template, Theme, Responsive, Fluid, Retina">
<link rel="shortcut icon" href="img/favicon.png">
<title>Resume Wizard : MONO</title>
<!-- <script type="text/javascript" src="http://code.jquery.com/jquery-2.1.4.min.js"></script>-->
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="jquery/AutoComplete2/autocomplete.js"></script>
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-reset.css" rel="stylesheet">
<!--external css-->
<link href="assets/font-awesome/css/font-awesome.css" rel="stylesheet" />
<!---------เพิ่มเติมเอง------------>
<link rel="stylesheet" type="text/css" href="assets/bootstrap-datepicker/css/datepicker.css" />
<link rel="stylesheet" type="text/css" href="assets/bootstrap-fileupload/bootstrap-fileupload.css" />
<!--right slidebar-->
<link href="css/slidebars.css" rel="stylesheet">
<!--Form Wizard-->
<link rel="stylesheet" type="text/css" href="css/jquery.steps.css" />
<!-- Custom styles for this template -->
<link href="css/style.css" rel="stylesheet">
<link href="css/style-responsive.css" rel="stylesheet" />
<!-- HTML5 shim and Respond.js IE8 support of HTML5 tooltipss and media queries -->
<!--[if lt IE 9]>
<script src="js/html5shiv.js"></script>
<script src="js/respond.min.js"></script>
<![endif]-->
<!--toastr-->
<link href="assets/toastr-master/toastr.css" rel="stylesheet" type="text/css" />
<!-----------บังคับกรอกเฉพาะตัวเลข---------------->
<SCRIPT language=JavaScript>
function chkNumber(ele)
{
var vchar = String.fromCharCode(event.keyCode);
if ((vchar<'0' || vchar>'9') && (vchar != '.') && (vchar != '-')) return false;
ele.onKeyPress=vchar;
}
</script>
<!-----------บังคับกรอกเฉพาะตัวเลข---------------->
</head>
<body>
<section id="container" class="sidebar-closed">
<!--<section id="container" class="">------กรณีที่ให้แสดง แถบ Menu หลักด้านซ้าย-------->
<? include 'SQL_Select_Data.php';?>
<!--main content start-->
<section id="main-content">
<section class="wrapper site-min-height">
<!-- page start-->
<div class="row">
<div class="col-lg-12" style="max-width:1440px; margin-left:auto; margin-right:auto;float: none;">
<!--progress bar start-->
<section class="panel" style="-webkit-border-radius: 10px;">
<header class="panel-heading" style="background-color: rgba(255, 108, 96, 0.44);">
กรอกข้อมูลการสมัครงานเข้าสู่ Resume Online ตาม Step กันเลย
</header>
<div class="panel-body">
<form id="wizard-validation-form" name="wizard-validation-form" action="inc/take_resume.php?Action=Add" Method="POST" enctype="multipart/form-data">
<div>
<h3>ข้อมูล - ประวัติส่วนตัว</h3>
<section>
<? include 'form_resume_step1.php';?>
<div class="form-group clearfix">
<div class="col-lg-3">
<input name="University_Name" type="text" id="show_arti_topic" size="50" />
<input name="University_ID" type="hidden" id="h_arti_id" value="" />
</div>
</div>
</section>
<h3>ข้อมูล - ที่อยู่</h3>
<section>
<? include 'form_resume_step2.php';?>
</section>
</div>
</form>
</div>
</section>
</div>
</div>
<!-- page end-->
</section>
</section>
<!--main content end-->
<? //include 'form_resume_sidebar_right.php';?>
<? include 'form_resume_footer.php';?>
</section>
<script type="text/javascript">
/*jQuery.noConflict();
jQuery( document ).ready(function( $ ) {
$('meDivID').fadeIn();
});*/
</script>
<!--------------For AutoComplete-------------------->
<link rel="stylesheet" href="jquery/AutoComplete2/autocomplete.css" type="text/css"/>
<script type="text/javascript">
function make_autocom2(autoObj,showObj){
var mkAutoObj=autoObj;
var mkSerValObj=showObj;
new Autocomplete(mkAutoObj, function() {
this.setValue = function(id) {
document.getElementById(mkSerValObj).value = id;
}
if ( this.isModified )
this.setValue("");
if ( this.value.length < 1 && this.isNotClick )
return ;
return "jquery/AutoComplete2/data.php?q=" +encodeURIComponent(this.value);
});
}
// การใช้งาน
// make_autocom(" id ของ input ตัวที่ต้องการกำหนด "," id ของ input ตัวที่ต้องการรับค่า");
make_autocom2("show_arti_topic","h_arti_id");
</script>
<!--------------For AutoComplete-------------------->
<!-- js placed at the end of the document so the pages load faster -->
<script src="js/bootstrap.min.js"></script>
<script class="include" type="text/javascript" src="js/jquery.dcjqaccordion.2.7.js"></script>
<script src="js/jquery.scrollTo.min.js"></script>
<script src="js/jquery.nicescroll.js" type="text/javascript"></script>
<script src="js/respond.min.js" ></script>
<!--right slidebar-->
<script src="js/slidebars.min.js"></script>
<!--Form Validation-->
<script src="js/bootstrap-validator.min.js" type="text/javascript"></script>
<!--Form Wizard-->
<script src="js/jquery.steps.min.js" type="text/javascript"></script>
<script src="js/jquery.validate.min.js" type="text/javascript"></script>
<!--common script for all pages-->
<script src="js/common-scripts.js"></script>
<!--script for this page-->
<script src="js/jquery.stepy.js"></script>
<script>
//step wizard
$(function() {
$('#default').stepy({
backLabel: 'Previous',
block: true,
nextLabel: 'Next',
titleClick: true,
titleTarget: '.stepy-tab'
});
});
</script>
<script type="text/javascript">
$(document).ready(function () {
var form = $("#wizard-validation-form");
form.validate({
errorPlacement: function errorPlacement(error, element) {
element.after(error);
}
});
form.children("div").steps({
headerTag: "h3",
bodyTag: "section",
transitionEffect: "slideLeft",
onStepChanging: function (event, currentIndex, newIndex) {
form.validate().settings.ignore = ":disabled,:hidden";
return form.valid();
},
onFinishing: function (event, currentIndex) {
form.validate().settings.ignore = ":disabled";
return form.valid();
},
onFinished: function (event, currentIndex) {
// alert("Submitted!");
//---------------------------------เพิ่มเอง
if(confirm('คุณต้องการ บันทึกข้อมูล ?'))
{
document.getElementById("wizard-validation-form").submit();
}
else
{ alert('ปรับปรุง - แก้ไขข้อมูลอีกครั้ง') }
//---------------------------------เพิ่มเอง
}
});
});
</script>
<script type="text/javascript" src="assets/bootstrap-fileupload/bootstrap-fileupload.js"></script>
<script type="text/javascript" src="assets/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
<script src="js/advanced-form-components.js"></script>
</body>
</html>
ผมได้ลบ Code บางส่วนที่ใช้ในระบบจริงๆออกไปในระดับนึง เพื่อให้ง่ายต่อการช่วยดู Code นะครับ
Tag : PHP, JavaScript, jQuery
|
ประวัติการแก้ไข
2015-06-17 15:30:11
2015-06-17 15:31:13
2015-06-17 15:32:13
2015-06-17 15:36:42
|
 |
 |
 |
 |
| Date :
2015-06-17 15:28:48 |
By :
terng_tk |
View :
1464 |
Reply :
2 |
|
 |
 |
 |
 |
|
|
|
|
 |
 |
|
 |
 |
| |
|
|
|
| |
|
อ่อออ ครับ เด๋วจะลองเปลี่ยนเวอชั่นอื่นดูครับผม
|
| |
|
|
| |
| Date :
2015-06-18 17:45:26 |
By :
terng_tk |
|
|
| |
|
|
|
|
|
| |
|
|
|
|
|
| |
|
 Load balance : Server 02
|
Quote:
