diff options
Diffstat (limited to '97suifangqa/apps/indicator/static')
-rw-r--r-- | 97suifangqa/apps/indicator/static/css/edit_history_data.css | 27 | ||||
-rw-r--r-- | 97suifangqa/apps/indicator/static/javascripts/edit_history_data.js | 47 |
2 files changed, 72 insertions, 2 deletions
diff --git a/97suifangqa/apps/indicator/static/css/edit_history_data.css b/97suifangqa/apps/indicator/static/css/edit_history_data.css index 9775539..49005be 100644 --- a/97suifangqa/apps/indicator/static/css/edit_history_data.css +++ b/97suifangqa/apps/indicator/static/css/edit_history_data.css @@ -1,3 +1,26 @@ +/* + * How To Change Radio Button Checkbox Style in CSS: + * http://viralpatel.net/blogs/css-radio-button-checkbox-background/ + */ +input[type="radio"] { + display: none; + margin: 4px; + vertical-align: middle; +} +input[type="radio"] + label { + display: inline-block; + height: 17px; + line-height: 17px; + margin-right: 2px; + padding: 2px 7px; + background-color: #F3F3F1; + border: 1px solid #9C9C9C; +} +input[type="radio"]:checked + label { + background-image: none; + background-color: #99CC33; +} + #edit_history_data_container { width: 588px; height: 180px; @@ -147,6 +170,10 @@ .edit_history_data_content .editing_data .data .invalid { border: 2px solid red; } +.edit_history_data_content .editing_data .data .radio_input { + margin-right: 8px; + float: left; +} .edit_history_data_content .editing_data .data .data_input { width: 200px; height: 17px; diff --git a/97suifangqa/apps/indicator/static/javascripts/edit_history_data.js b/97suifangqa/apps/indicator/static/javascripts/edit_history_data.js index f4deafd..e0dff4a 100644 --- a/97suifangqa/apps/indicator/static/javascripts/edit_history_data.js +++ b/97suifangqa/apps/indicator/static/javascripts/edit_history_data.js @@ -74,10 +74,21 @@ $(document).ready(function(){ }); // }}} + // initalize // set datepicker 'date_input' value var date_init = $.datepicker.parseDate('yy-mm-dd', $(".date_input").attr('value')); $(".date_input").datepicker("setDate", date_init); + // select radio button according to the original value + if ($(".editing_data .radio_input").length) { + $(".radio_input input:radio").prop("checked", false); + } + if (record.value === '-') { + $(".radio_input #minus_r").prop("checked", true); + } + else { + $(".radio_input #plus_r").prop("checked", true); + } // record data validate {{{ // date {{{ @@ -314,9 +325,41 @@ $(document).ready(function(){ else if (data_type == DATA_TYPES.FLOAT_RANGE_TYPE) { // TODO } - else if (data_type == DATA_TYPES.PM_TYPE) { + else if (data_type == DATA_TYPES.PM_TYPE) { // {{{ // TODO - } + var radioinput_help = '<p>请直接点击选择</p>'; + // tooltip + $(".radio_input").qtip({ + id: 'radioinput', + prerender: false, + content: { + text: radioinput_help + }, + position: { + my: 'bottom left', + at: 'top right' + }, + show: { + event: 'mouseenter' + }, + hide: { + event: 'mouseleave unfocus' + } + }); + // validate + $(".radio_input").on('validate', null, function() { + if ($(".radio_input input:radio:checked").length != 1) { + var qtip_content = '<p>请选择化验结果</p>'; + $(this).qtip('api').set('content.text', + qtip_content); + $(this).qtip('api').show(); + } + else { + // valid + record_data.value = $(".radio_input input:radio:checked").val(); + } + }); + } // }}} else { // unknown return false; |