0

我是使用任何 jQuery 的新手。我需要使用 datepicker 和 timepicker 制作我的表单，因为我需要两者，我选择这个： http ://trentrichardson.com/2010/04/19/timepicker-addon-for-jquery-ui-datepicker/ 我想make 显示在时间低于日期的页面中，并带有用于设置时间的条。

我的代码

cobadate.html

<meta name="viewport" content="width=device-width,initial-scale=1.0"/>
<link rel="stylesheet" type="text/css" href="css/style1.css" />
<link type="text/css" href="timepicker/css/ui-lightness/jquery-ui-1.7.2.custom.css" rel="stylesheet" />

<script src="jq/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="timepicker/js/jquery-ui.js"></script> 
<link type="text/css" href="timepicker/js/jquery.ui.all.css" rel="stylesheet" />

<script src="timepicker/js/jquery-ui-timepicker-addon.js"></script>
<script src="timepicker/js/jquery-ui-sliderAccess.js"></script>
<link type="text/css" href="timepicker/css/jquery-ui-timepicker-addon.css" rel="stylesheet" />

<script src="jq/proses/set_ip.js"></script> 
<script src="jq/proses/glukosa/add_glucose.js"></script>
<script src="jq/proses/script.js"></script>

<script src="jq/timer.js" type="text/javascript" charset="utf-8"></script>
<title>edc - e diabet consult</title>
<h1 align="center">Tambah Glukosa</h1>
<p align="left" class="navigation">
<a href="glukosa.html" class="back">
<img src="ico/kembali.png">
</a>
</p>

<form id="form_glukosa">
<p align="center">
<strong>Tanggal:</strong><br />
<input type="text" id="tanggal" name="tanggal" value="" placeholder="01-02-2013 10:00"/><br />

<strong>Glukosa (mg/dl):</strong><br />
<input type="text" name="glukosa" id="glukosa" value=""/><br />

<strong>Konsumsi obat:</strong><br />
<input type="text" id="obat" name="obat" value=""/><br />

<strong>Konsumsi makanan:</strong><br />
<input type="text" id="makanan" name="makanan" value=""/><br />

<strong>Status</strong><br />
<select name="status" id="status">
<option value="">--Pilih--</option>
<option value="1">Sebelum sarapan</option>
<option value="2">Sesudah sarapan</option>
<option value="3">Sebelum makan siang</option>
<option value="4">Sesudah makan siang</option>
<option value="5">Sebelum makan malam</option>
<option value="6">Sesudah makan malam</option>
<option value="7">Sebelum tidur</option>
</select><br />

<strong>Keterangan</strong><br />
<select name="ket" id="ket">
<option value="">--Pilih--</option>
<option value="1">Telat</option>
<option value="2">Tepat waktu</option>
</select><br />

<strong>Emosional</strong><br />
<select name="emosi" id="emosi">
<option value="">--Pilih--</option>
<option value="1">Sedang Emosi</option>
<option value="2">Tidak Emosi</option>
</select><br />

<input type="button" value="Simpan" onclick="save_glukosa()" id="simpan_glukosa" class="button"/>
<input type="reset" value="Reset" class="button"/>

</p>
</form>

add_glukosa.js

var urlini = seturl();
var part= 'glukosa/';

$(document).ready(function() {
    $('#tanggal').val(curdate()+' '+curtime());


    $('#tanggal').datetimepicker({
        onClose: function(dateText, inst) {
            //confirm('closing');
               var retVal = confirm("Do you want to continue ?");
               //call the function that calculate which is the meal name according the condition of date

                if( retVal == true ){
                    alert("User wants to continue!");
                    //the value that we set is true
                    return true;
                }else{
                    alert("User does not want to continue!");
                    //the value that we set is wrong
                    return false;
                }
        }
    });

});

function curdate(){
    var today = new Date();
    var dd = today.getDate();
    var mm = today.getMonth()+1; //January is 0!
    var yyyy = today.getFullYear();

    if(dd<10){dd='0'+dd} if(mm<10){mm='0'+mm} today = mm+'/'+dd+'/'+yyyy;
    return today;
}

function curtime(){
    var d = new Date();
    var curr_hour = d.getHours();
    var curr_min  = (d.getMinutes()<10?'0':'') + d.getMinutes();
    return (curr_hour + ":" + curr_min);
}

//Save data into db
function save_glukosa() {
    glu = /^([-0-9_-])+$/i.test($("#glukosa").val());
    obat =  /^([-a-z-A-Z 0-9_-])+$/i.test($("#obat").val());
    makanan =  /^([-a-z- A-Z_-])+$/i.test($("#makanan").val());
    stat = ($("#status").val());
    ket = ($("#ket").val());
    emo = ($("#emosi").val());

    if(glu == "")
    {
        alert("Terjadi kesalahan pada penginputan glukosa. Glukosa harus bernilai angka.");
    } 
    else if(obat == "")
    {
        alert("Masukan obat yang dikonsumsi");
    }
    else if(makanan == "")
    {
        alert("Masukan makanan yang dikonsumsi");
    }
    else
    {
        $.post(urlini+part+'add',
            $('#form_glukosa').serialize(),function(msg){
            if(msg == '1')
            {
                alert("Data berhasil disimpan!");
                window.location="glukosa.html";
            }
            else if(msg == '0')
            {
                alert("Masih ada data yang kosong.");
            }
        });
    }
}

问题： 我希望我的 datetimepicker 出现在中间，而不是我制作的左侧。我不知道如何更改CSS。

我的问题： 如何让 datetimepicker 出现在中间？

你能给我代码来回答这些问题吗？

4

0 回答 0