diff templates/programTable.html @ 23:f3bf1be1a51b

Change: using ajax in custom reservation method

--- a/templates/programTable.html	Fri Jul 17 22:40:41 2009 +0900
+++ b/templates/programTable.html	Thu Jul 23 23:35:43 2009 +0900
@@ -9,6 +9,9 @@
 
 {literal}
 <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
+<script type="text/javascript" src="js/jquery-ui-1.7.2.custom.min.js"></script>
+<link rel="stylesheet" href="start/jquery-ui-1.7.2.custom.css" type="text/css">
+<script type="text/javascript" src="js/mdabasic.js"></script>
 <script type="text/javascript">
 	var PRG = {
 		rec:function(id){
@@ -19,8 +22,78 @@
 					$('#resid_' + id).addClass('prg_rec');
 				}
 			});
+		},
+		customform:function(id) {
+			$('#floatBox4Dialog').dialog('close');
+			$.get('reservationform.php', { program_id: id }, function(data) {
+				if(data.match(/^error/i)){
+					alert(data);
+				}
+				else {
+					var str = data;
+					str += '<div style="margin:2em 0 1em 0;text-align:center;"><a href="javascript:PRG.customrec()" class="ui-state-default ui-corner-all ui-dialog-buttonpane button">予約する</a></div>';
+					$('#floatBox4Dialog').html(str);
+					$('#floatBox4Dialog').dialog('open', 'center');
+				}
+			});
+		},
+		customrec:function() {
+			var id_syear = $('#id_syear').val();
+			var id_smonth = $('#id_smonth').val();
+			var id_sday = $('#id_sday').val();
+			var id_shour = $('#id_shour').val();
+			var id_smin = $('#id_smin').val();
+			var id_eyear = $('#id_eyear').val();
+			var id_emonth = $('#id_emonth').val();
+			var id_eday = $('#id_eday').val();
+			var id_ehour = $('#id_ehour').val();
+			var id_emin = $('#id_emin').val();
+			var id_channel_id = $('#id_channel_id').val();
+			var id_record_mode = $('#id_record_mode').val();
+			var id_title = $('#id_title').val();
+			var id_description = $('#id_description').val();
+			var id_category_id = $('#id_category_id ').val();
+			var id_program_id = $('#id_program_id').val();
+			var with_program_id = $('#id_program_id').attr('checked');
+			
+			if( ! with_program_id ) id_program_id = 0;
+			
+			$.post('customReservation.php', { syear: id_syear,
+							  smonth: id_smonth,
+							  sday: id_sday,
+							  shour: id_shour,
+							  smin: id_smin,
+							  eyear: id_eyear,
+							  emonth: id_emonth,
+							  eday: id_eday,
+							  ehour: id_ehour,
+							  emin: id_emin,
+							  channel_id: id_channel_id,
+							  record_mode: id_record_mode,
+							  title: id_title,
+							  description: id_description,
+							  category_id: id_category_id,
+							  program_id: id_program_id }, function(data) {
+				if(data.match(/^error/i)){
+					$('#floatBox4Dialog').dialog('close');
+					alert(data);
+				}
+				else {
+					var id = parseInt(data);
+					if( id ) {
+						$('#resid_' + id).addClass('prg_rec');
+					}
+					$('#floatBox4Dialog').dialog('close');
+				}
+			});
 		}
 	}
+	
+	$(document).ready(function () {
+		var DG = $('#floatBox4Dialog');
+		DG.dialog({title:'録画予約',width:600});
+		DG.dialog('close');
+	});
 </script>
 <style type="text/css">
 <!--
@@ -126,7 +199,7 @@
   <td>{$program.title|escape}</td>
   <td>{$program.description|escape}</td>
   <td><input type="button" value="録画" onClick="javascript:PRG.rec('{$program.id}')" /></td>
-  <td><a href="reservation.php?program_id={$program.id}">詳細へ</a></td>
+  <td><input type="button" value="詳細" onClick="javascript:PRG.customform('{$program.id}')" /></td>
  </tr>
 {/foreach}
 </table>
@@ -157,8 +230,7 @@
 {/if}
 {/if}
 
-
-
+<div id="floatBox4Dialog">jQuery UI Dialog</div>
 
 {literal}
 <script type="text/javascript">