2012-12-01 69 views
0

我有一個代碼如下,它顯示在一列中的文本輸入,第二列中的總標記列和剩餘在最後一列中的標記。該表看起來像下面這樣:值點只讀文本框中顯示

Marks Per Answer    Total Marks Marks Remaining 
(blank text input)    4    4 
(blank text input)    6    6 
(blank disabled text input)  4    4 

但我的問題是,如果只讀文本輸入是空的,它應該顯示「佔總分」欄目(的SO 4在只讀文本輸入的值上面的例子)。

此外,只讀文本輸入包含「Marks Remaining」列下的總標記數,這是不正確的,對於該行,它應該顯示0.(只讀文本輸入包含值4,所以如果我們減去與下總標記4,它應該標記剩餘禁用文本輸入行讓0)

所以表真的應該像下面這樣當用戶訪問該頁面:

Marks Per Answer            Total Marks Marks Remaining 
(blank text input)             4    4 
(blank text input)             6    6 
(readonly text input = 4 (same value as under Total Marks))  4    0 

我的問題是,如何通過更改下面的jquery解決上述兩個步驟:

$(function() { 
     //alert("here");   
     var questions = $('#markstbl td[class*="_ans"]').length; 

     //disable single entry 

     for (var i=0;i<=questions;i++){ 
     if ($("[class*=q" + i + "_mark]").length == 1) { 
     //alert(t_marks); 
     var t_marks = $("[class*=q" + i + "_ans]"); 
     var t_marksHtml = t_marks.html(); 
     t_marks.html("0"); 
     $("[class*=q" + i + "_mark]").val(t_marksHtml).attr('readonly', true); 
     //$("[class*=q"+i+"_mark]").attr('readonly',true); 
}     
} 

     //find each question set and add listeners 
     for (var i = 0; i <= questions; i++) { 
      $('input[class*="q' + i + '"]').keyup(function() { 
       var cl = $(this).attr('class').split(" ")[1] 
       var questionno = cl.substring(cl.indexOf('q') + 1, cl.indexOf('_')); 
       var tot_marks = $(".q" + questionno + "_ans_org").val(); 
       //alert(tot_marks); 
       var ans_t = 0; 
       $("[class*=q" + questionno + "_mark]").each(function() { 
        var num = (isNaN(parseInt($(this).val()))) ? 0 : parseInt($(this).val()); 
        ans_t += parseInt(num); 
       }); 
       ans_t = tot_marks - ans_t; 
       //alert(ans_t); 
       //var fixedno = tot_marks; 
       var ans = ans_t; 
       var answerText = '<strong>' + ans + '</strong>'; 
       $(".q" + questionno + "_ans").val(ans); 
       $(".q" + questionno + "_ans_text").html(answerText); 
      }); 
     } 
    }); 

下面是動態HTML表:

<form id="Marks" action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" method="post"> 


<table border='1' id='markstbl'> 
<thead> 
<tr> 
<th class='questionth'>Question No.</th> 
<th class='questionth'>Question</th> 
<th class='answerth'>Answer</th> 
<th class='answermarksth'>Marks per Answer</th> 
<th class='totalmarksth'>Total Marks</th> 
<th class='noofmarksth'>Marks Remaining</th> 
</tr> 
</thead> 
<tbody> 
<?php 
$row_span = array_count_values($searchQuestionId); 
$prev_ques = ''; 
foreach($searchQuestionId as $key=>$questionId){ 

?> 

<tr class="questiontd"> 
    <?php 
    if($questionId != $prev_ques){ 
    ?> 
    <td class="questionnumtd" name="numQuestion" rowspan="<?php echo$row_span[$questionId]?>"><?php echo$questionId?> <input type="hidden" name="q<?php echo$questionId?>_ans_org" class="q<?php echo$questionId?>_ans_org" value="<?php echo$searchMarks[$key]?>"><input type="hidden" name="q<?php echo$questionId?>_ans" class="q<?php echo$questionId?>_ans" value="<?php echo$searchMarks[$key]?>"></td> 
    <td class="questioncontenttd" rowspan="<?php echo$row_span[$questionId]?>"><?php echo$searchQuestionContent[$key]?> </td> 
    <?php 
    } 
    ?> 
<td class="answertd" name="answers[]"><?php echo$searchAnswer[$key]?></td> 
<td class="answermarkstd"> 
<input class="individualMarks q<?php echo$questionId?>_mark_0" q_group="1" name="answerMarks[]" id="individualtext" type="text" /> 
</td> 
<?php 
    if($questionId != $prev_ques){ 
    ?> 
<td class="totalmarkstd" rowspan="<?php echo$row_span[$questionId]?>"><?php echo$totalMarks[$key]?></td> 
<td class="noofmarkstd q<?php echo$questionId?>_ans_text" q_group="1" rowspan="<?php echo$row_span[$questionId]?>"><?php echo"<strong>".$searchMarks[$key]."</strong>"?></td> 
<?php 
    } 
    ?> 
</tr> 
<?php 
$prev_ques = $questionId; 
} 
?> 
</tbody> 
</table> 
</form> 

在jQuery的功能,我想用t_marks變量顯示在文本輸入值的時刻,但沒有顯示時,我提醒t_marks

UPDATE:

完整的HTML:

<table border='1' id='markstbl'> 
<thead> 
<tr> 
<th class='questionth'>Question No.</th> 
<th class='questionth'>Question</th> 
<th class='answerth'>Answer</th> 
<th class='answermarksth'>Marks per Answer</th> 
<th class='totalmarksth'>Total Marks</th> 
<th class='noofmarksth'>Marks Remaining</th> 
</tr> 
</thead> 
<tbody> 

<tr class="questiontd"> 
     <td class="questionnumtd" name="numQuestion" rowspan="2">1 <input type="hidden" name="q1_ans_org" class="q1_ans_org" value="5"><input type="hidden" name="q1_ans" class="q1_ans" value="5"></td> 
    <td class="questioncontenttd" rowspan="2">Here are 2 answers </td> 
    <td class="answertd" name="answers[]">B</td> 
<td class="answermarkstd"> 
<input class="individualMarks q1_mark_0" q_group="1" name="answerMarks[]" id="individualtext" type="text" /> 
</td> 
<td class="totalmarkstd" rowspan="2">5</td> 
<td class="noofmarkstd q1_ans_text" q_group="1" rowspan="2"><strong>5</strong></td> 
</tr> 

<tr class="questiontd"> 
    <td class="answertd" name="answers[]">D</td> 
<td class="answermarkstd"> 
<input class="individualMarks q1_mark_0" q_group="1" name="answerMarks[]" id="individualtext" type="text" /> 
</td> 
</tr> 

<tr class="questiontd"> 
     <td class="questionnumtd" name="numQuestion" rowspan="1">2 <input type="hidden" name="q2_ans_org" class="q2_ans_org" value="5"><input type="hidden" name="q2_ans" class="q2_ans" value="5"></td> 
    <td class="questioncontenttd" rowspan="1">Here is a single answer </td> 
    <td class="answertd" name="answers[]">True</td> 
<td class="answermarkstd"> 
<input class="individualMarks q2_mark_0" q_group="1" name="answerMarks[]" id="individualtext" type="text" /> 
</td> 
<td class="totalmarkstd" rowspan="1">5</td> 
<td class="noofmarkstd q2_ans_text" q_group="1" rowspan="1"><strong>5</strong></td> 
</tr> 
</tbody> 
</table> 
+1

您可以包括一些完整的HTML,所以我可以創造一些真正的數據搗鼓? –

+0

@JamesKleeh給我10分鐘以從視圖源獲取html,我將在我的問題的'UPDATE'部分顯示它 – user1861818

+0

@JamesKleeh我已經包含了來自視圖源的完整html並將其包含在更新部分 – user1861818

回答

1

所以我覺得這應該是所有您需要:

if ($("[class*=q" + i + "_mark]").length == 1) { 
     //alert(t_marks); 
     var t_marks = $("[class*=q" + i + "_ans]"); 
     var t_marksHtml = t_marks.html(); 
     t_marks.html("0"); 
     $("[class*=q" + i + "_mark]").val(t_marksHtml).attr('readonly', true); 
     //$("[class*=q"+i+"_mark]").attr('readonly',true); 
    } 
+0

你的jQuery代碼到我的應用程序和上面的問題中的jQuery代碼中。現在它確實將只讀文本輸入行的「剩餘總標記數」更改爲0,這非常棒。但是有兩個小問題。第一個問題是,如果我點擊只讀文本框並按下一個鍵,那麼「剩餘商標總數」下的數字0將變回其原始值。第二個問題是它仍然沒有顯示只讀文本框中的值。但你到達那裏。你有更多的想法嗎? Upvoted回答 – user1861818

+0

我想我錯過了一些HTML。我看到_ans_org的引用,但是我沒有在任何地方看到該輸入元素。 –

+0

對不起我的錯,沒有顯示完整的HTML,這裏是完整的HTML,再次對不起 – user1861818

0

這可能幫助:

$("[class*=q"+questionno+"_mark]").each(function(){ 

搜索器稱爲q[X]_mark

類和此行

<input class="individualMarks q<?php echo$questionId?>_mark_0" q_group="1" name="answerMarks[]" id="individualtext" type="text" /> 

寫的類是這樣的:

q[X]_mark_0 

我是不是如果這是你的問題,但如果不對,我會繼續尋找。

+0

嗨查爾斯所以你是說改變這行代碼'$(「[class * = q」+ questionno +「_ mark]」)。each(function(){'to'$(「[class * = q」 + questionno +「_ mark」_0「)。each(function(){'? – user1861818

+0

yup,你試過嗎? –

+0

是的,我已經嘗試過了,但還是沒有運氣,你有其他想法嗎? – user1861818