อยากถามเกี่ยวกับ Dialog Method ของ Jquery ครับ

ผมได้พยายาม กำหนดตำแหน่งของการแสดงผล Dialog โดย ใช้ Option position คือ

$(xxx).dialog({ position:[350,100] }) //โดยกำหนดตามแกน x,y

เมื่อทำการแสดงผล มันไม่ได้แสดงตามตำแหน่งที่ระบุไว้ครับ ไม่ทราบว่าผมควรจะต้องทำอย่างไรบ้างครับ หรือว่ามันไม่สามารถกำหนดตำแหน่งได้

หรือผมต้องเพิ่มส่วนไหน , แทรกไฟล์ .js เข้าไปเพิ่ม หรือเปล่าครับ

รบกวนผู้รู้ด้วยครับ ผิดพลาดประการใดขออภัยมาน่ะที่นี้ด้วยครับ ขอบคุณครับ

มา Update ครับเพื่อใครจะเจอปัญหาอย่างผม ผมงมจนเจอวิธีที่แสนง่าย..

คือ ใช้คำสั่ง Return false;

เป็นอันจบครับ

ขอบคุณครับ

แค่ยอมสละเวลามาดู Code ให้ผม แค่นี้ก็ ซึ้งในน้ำใจคุณ Ninenik  มากเลยครับ เขียนบทความดีๆต่อไปน่ะครับ..

เท่าที่ดูโค้ด ไม่มีอะไรผิด .. พยายามต่อน่ะครับ คงไม่เกินความสามารถ

ส่วน Css

<style >
	.ui-buttom{
		font-size:10px;
		
	}
	.fill-input{
		font-size:10px;
		border:0.1em solid #C2CFDF;
	}
	div.head{
		font-size: 14px;
		font-weight: bold;
		background-color:#FFCC66;
	}
	
	.text{
		padding: 5px 10px 0px 0px;	
		font-size : 12px;
		font-weight: bold;
	}
	div.table{
		width: 550px;
		border:0.01em solid #FFCC66;
		padding: 2px 5px 10px 5px;
		
	}
	
	.text-data{
		font-size : 12px;
		padding: 5px 10px 0px 5px;	
	}
	.ui-buttom{
		font-size:10px;
		
	}
	
	label{
		cursor:pointer;
	}
	
	.ui-exam{
		font-size:9px;
		color:gray;
		
	} 
	.ui-dialog{
		font-size:10px;
		
   }
   .ui-datepicker{  
		font-size:10px;  
	}
</style>

ส่วน script

<script language ="javascript">

	$(function(){
		$.fx.speeds._default = 2000;
		$("#dialog-form").dialog("destroy");
		$("#dialog-form").dialog({
		
			autoOpen: false,
			height: 600,
			width: 600,
			modal: true,
			position:[0,0],
			show: 'drop',
			hide: 'clip',
			buttons: {
				Submit: function() {
				$(this).dialog('close');	
				},
				Cancel: function() {
					$(this).dialog('close');
				}
			}

		})

	})

function fnc_click(){
		
		$("#dialog-form").dialog("open");

	}
</script>	

ส่วนที่ 3

<div id="dialog-form" title="ทดสอบ">
	<form action="BookingInfo_ss.php" method="post" name ="frm" id="frm" >
		<div  class="table" >
			<span class="ui-exam">**All fields are required to complete**</span>
			<div class="head"><li>Please insert infomation</li></div>
				
				<div class="text"><label for="email">Email : </label></div><div class="text-data"><input name="email" id="email"class="fill-input" size="60" maxlength="100" ></div><span class="ui-exam">exam : xxx@hotmail.com,xxx@gmail.com</span>
				<div class="text"><label for="Name-cust">Name : </label></div><span class="text-data"><input name="Name-cust" id="Name-cust"class="fill-input" size="60" maxlength="40" ></span>
				<div class="text"><label for="lastName-cust">Last Name : </label></div><span class="text-data"><input name="lastName-cust" id="lastName-cust"class="fill-input" size="60" maxlength="40" ></span>
				<div class="text"><label for="Tel_cust">Tel. : </label></div><span class="text-data"><input name="Tel_cust" id="Tel_cust"class="fill-input" size="60" maxlength="15" ></span><span class="ui-exam">Number Only [0-9] format: xxxxxxxxxx</span>
				
		</div>
	</form>
</div>

<!--เมื่อกด link เปิด dialog-->

<a href="#" onclick="javascript:fnc_click()">กด</a>

ประมาณนี้แหละครับ ผมไม่เคยทำ อัพไฟล์ที่ทำให้ดูผ่านเว็บ(ทำไมเป็นเลยครับ) ครับ จึงต้องเอา Code มาให้ดูแบบนี้ ขอรบกวนและคำแนะนำด้วยครับ

ขอบคุณที่สละเวลามาตอบคำถามผมครับ.. 

ถ้าอยากได้คำตอบที่ไม่ต้องงมเข็ม คงต้องอัพไฟล์ที่ทำให้ดูผ่านเว็บ จะได้แนะนำถูก บางทีอาจจะเป็นลักษณะเส้นผมบังภูเขา

ขอบคุณมากๆเลยครับ... 

ผมลองไล่แก้ CSS แล้วก็ไม่หายครับ ผมเลยลองไปกำหนด Option position ของ dialog modal ดู โดยกำหนด

$(xxx).dialog({ position:[0,0] })//คือแกน x = 0 y = 0

พอแสดงผลออกมา dialog ชิด ซ้าย แต่ไม่ติดบน.. ผมเลย งง ตกลงที่ผมกำหนดค่านี้ถูกหรือผิดกันแน่ครับ.. 

ขอบคุณมากครับ คุณ Ninenik

ใช้แค่ 3 ส่วนก็พอ ส่วนใน ui  จะเป็นส่วนที่มีทั้งหมด ซึ่งรวมไว้ในไฟล์ js/jquery-ui-1.8.4.custom.min.js เรียบร้อยแล้ว หรือจะเข้าไปทำการดาวน์โหลดเฉพาะส่วนที่ใช้งานก็ได้ เหมือนกัน
เข้าไปที่ http://jqueryui.com/download เลือกสคริปส่วนที่จะใช้งาน เลือก theme แล้วก็กดปุ่มดาวน์โหลดฝั่งขวามือ

ครับผม จะลองไล่ Css ดู ครับ ได้หรือไม่ได้จะมาบอกกล่าวครับ

และอีกเรื่องครับ ไฟล์ .js ของ Jquery ที่จำเป็น ต้องใส่เข้าไป มี แค่ 3 ส่วนนี้เท่านั้นหรือครับ

<link rel="stylesheet" type="text/css" href="js/css/redmond/jquery-ui-1.8.4.custom.css">
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> 
<script type="text/javascript" src="js/jquery-ui-1.8.4.custom.min.js"></script>

หรือว่าเราสามารถแทรก .js ของ folder ชืื่อ ui ที่มากับ demos เพิ่มเข้าไปอีกได้ เพราะผมลองใส่เพิ่มดู แต่ก็ไม่เห็นผลลัพท์ที่แตกต่างครับ หรือว่าำไม่จำเป็นครับ

ขอบคุณครับ

ถ้าเรียกมา และแสดง แต่ตำแหน่งไม่ถูก แสดงว่าเกิดกับ css คงต้องไล่ css ดู