<!-- load css dan js -->
<script src="<?php echo ASSETS_URL;?>plugins/form/jquery.validate.js"></script>
<link rel="stylesheet" href="<?php echo ASSETS_URL;?>plugins/select2/select2.min.css" rel="stylesheet" type="text/css"/>
<script src="<?php echo ASSETS_URL;?>plugins/select2/select2.min.js"></script>
<!-- end load css dan js -->

<section class="content-header">
	<h1>
		<?php echo $app_title;?>
		<small><?php echo $app_desc;?></small>
	</h1>
</section>

<section class="content">
	<div class="box box-info"> <!-- start .box -->
		<div class="box-header"> <!-- start .box-header -->
			<?php echo $form_header;?>
		</div> <!-- end .box-header -->
		
		<div class="box-body"> <!-- start .box-body -->
			<form name="frmResponden" id="frmResponden" method="post" class="form-horizontal">
				<input type="hidden" name="f_id" id="f_id" value="" >
				<div class="form-group">
					<label class="col-md-2" style="padding-top:7px;">Customers</label>
					<div class="col-md-6"><input type="text" name="f_customer_id" id="f_customer_id" class="form-control" placeholder="Customers ..." value="" disabled></div>
				</div>
				<div class="form-group">
					<label class="col-md-2" style="padding-top:7px;">Periode ke</label>
					<div class="col-md-6"><input type="text" name="f_event_id" id="f_event_id" class="form-control" placeholder="Event ke ..." value="" disabled></div>
				</div>
				<div class="form-group">
					<label class="col-md-2" style="padding-top:7px;">Name <span class="text-red">*</span></label>
					<div class="col-md-6"><input type="text" name="f_name" id="f_name" class="form-control" placeholder="Name ..." value="" required></div>
				</div>
				<div class="form-group">
					<label class="col-md-2" style="padding-top:7px;">Age <span class="text-red">*</span></label>
					<div class="col-md-6"><input type="text" name="f_age" id="f_age" class="form-control" placeholder="Age ..." value="" required></div>
				</div>
				<div class="form-group">
					<label class="col-md-2" style="padding-top:7px;">Gender <span class="text-red">*</span></label>
					<div class="col-md-6">
					<?php
						$gender = array('L'=> 'Laki-Laki','P'=> 'Perempuan',);
						echo form_dropdown('f_gender',$gender,'L','id="f_gender" class="form-control select" style="width: 100%" required');
					?>
					</div>
				</div>
				<div class="form-group">
					<label class="col-md-2" style="padding-top:7px;">Email <span class="text-red">*</span></label>
					<div class="col-md-6"><input type="text" name="f_email" id="f_email" class="form-control" placeholder="Email ..." value="" required></div>
				</div>
				<div class="form-group">
					<label class="col-md-2" style="padding-top:7px;">HP <span class="text-red">*</span></label>
					<div class="col-md-6"><input type="text" name="f_hp" id="f_hp" class="form-control" placeholder="HP ..." value="" required></div>
				</div>
				<div class="col-md-8" align="center" id="fnButton">
		<?php 	
			if($fAct == 'Add')	echo '<input type="submit" name="submit" value="Save" id="btnSave" class="btn btn-success" />';

			if($fAct == 'Edit')	echo '<input type="submit" name="submit" value="Ubah" id="btnUpdate" class="btn btn-warning" />';
		?>
				&nbsp;&nbsp;&nbsp;
				<a onClick="fnBack()" class="btn btn-danger"> Cancel</a>
				</div>
			</form>

		</div> <!-- end .box-body -->
		<div class="box-footer" align="right"> <!-- start box-footer -->
		  <p>Page rendered in <strong>{elapsed_time}</strong> seconds</p>
		</div> <!-- end .box-footer-->
	</div> <!-- end .box -->
</section><!-- /.content -->

<script>
var oTable;
$(document).ready(function(){
	$('#frmResponden').validate({
		highlight: function(element, errorClass, validClass) {
			$(element).parents('.form-group').removeClass('has-success').addClass('has-error');
		},
		unhighlight: function(element, errorClass, validClass) {
			$(element).parents('.form-group').removeClass('has-error').addClass('has-success');
		}		
	});
	

	var $f_gender = $('#f_gender'); 
    $f_gender.select2(/*{
		placeholder: "-- Pilih ..",
		ajax: {
			url 		: "<?php echo site_url('responden/fnRespondenComboData');?>", // << Example
			dataType	: 'json',
			delay		: 250,
			processResults		: function(data,params) {
				return {
				        results: data.result,
					}
			},
			cache: true
		},
		minimumInputLength: 0,
		//escapeMarkup: function (markup) { return markup; },
		//templateResult: formatAccount,
	}*/);

<?php if($fAct == 'Edit') { ;?>
	$.get("<?php echo site_url('responden/fnRespondenDataId?id='.$fId);?>",function(data){
		if(data)
		{
			$('#f_id').val(data.f_id);
			$('#f_event_id').val(data.f_event_no);
			$('#f_customer_id').val(data.f_customer_name);
			$('#f_name').val(data.f_name);
			$('#f_age').val(data.f_age);
			$('#f_gender').val(data.f_gender).trigger('change');
			$('#f_date').val(data.f_date);
			$('#f_email').val(data.f_email);
			$('#f_hp').val(data.f_hp);
			$('#f_survey').val(data.f_survey);
			$('#f_ipaddres').val(data.f_ipaddres);
		}
	}, "json");

	var url = "<?php echo site_url('responden/fnRespondenUpdate?id='.$fId);?>";
<?php } ?>

<?php if($fAct == 'Add') { ;?>
	var url = "<?php echo site_url('responden/fnRespondenSave');?>";
<?php } ?>

	$('#f_age').datepicker({
		dateFormat: "yy-mm-dd",
		'changeYear':true,
		'changeMonth':true,
		regional: "id"
	});

	// Menyimpan data
	$('#frmResponden').submit(function(e){
		var oForm = $('#frmResponden');
		var rec = $('#frmResponden').serializeArray();
		rec.push({name: '<?php echo $this->security->get_csrf_token_name(); ?>',value:'<?php echo $this->security->get_csrf_hash();?>'});
		e.preventDefault();
		if(oForm[0].checkValidity()) {
			$.post(url, rec, function(msg){
				if(msg.msg)
				{
					window.location.href = "<?php echo site_url('responden');?>";
				}
				else
				{
					infoDialog.realize();
					infoDialog.setTitle('Info').setMessage('<center>Gagal !!</center>').setType(BootstrapDialog.TYPE_DANGER).open();
				}
			}, 'json').fail(function(e){
				infoDialog.realize();
				infoDialog.setTitle('Info').setMessage('<center>'+e.status+'</center>').setType(BootstrapDialog.TYPE_DANGER).open();
			});
		}
	});
});

function fnBack()
{
	window.location.href = "<?php echo site_url('responden');?>";
}

function formatAccount(result)
{
	if (result.loading) return result.text;
	
	var markup = "<span>"+result.text+"<br/>"+result.contact+" ("+result.phone+" - "+result.email+")</span>";
	return markup;
}
</script>



