シンプルな html ページから、ユーザーは「問題を追加」というボタンを押します。
その「クリック」で、jQuery ダイアログがポップアップし、元のページでは「非表示」になっているテーブルが表示されます (表示: なし)。
ユーザーは、jQuery ダイアログの入力フィールドに「番号」 (医療コードに詳しい方向けの icd-9 コード) を入力します。
ユーザーが .dialog のボタンをクリックすると、数値が読み取られてトリミングされ、if/else の最初の部分に送信されます。
数字が 3 文字未満の場合、「これは有効な icd-9 コードではありません」というメッセージが div に表示されます。
(有効であれば、.ajax 呼び出しを実行して、対応する icd-9 が存在するかどうかを確認します。存在しない場合は、"No icd-9" というメッセージを表示するか、icd-9 コードと icd-9 テキストを表示します)
最初の部分はすべて正常に機能しますが、「エラー」メッセージを表示した後、ユーザーはすぐに (メッセージをほとんど見ることができません - フローを停止するアラートを表示し、メッセージが存在することを確認しました) に戻されます。 .dialog ではなく、元の html ページ。
問題のコードは次のとおりです。
$("#findbuttonicd9").click(function() {
varicd9 = document.getElementById('icd9input').value;
varicd9 = varicd9.trim();
if (varicd9.length < 3)
{
document.getElementById("listicd9").innerHTML = varicd9 + "is not a valid ICD-9 Code";
return;
}
else
{$.ajax({
type: "POST",
url: readicd9backend.php,
data: {icd9: varicd},
dataType : 'json',
success: function(result)
{
$("#div1").html("");
if(result.length >= 1)
{
var output = "<table width='500px' class = 'findtable'>";
$.each(result, function(index, value)
{ output += "<tr><td id='icd9' width='50px'>" + value.icd9codedot +
"</td><td width='250px' style='text-align:left'>" + value.icd9long +
"</td></tr>";
});
output += "</table>";
$("#listicd9").html(output);
}
else
{$("#listicd9").html("No matches");}
},
error : function(e) { ("#listicd9").html('Database access error'); }
});
}
});
「return」を追加しようとしましたが(上記を参照)、「return」なしで実行すると、常に元の HTML ページに戻ります。
この「フロー制御」の問題は私にとって新しい問題です。そのため、参照だけでも助けていただければ幸いです。これを自分でハックしようとすることができます。
改めまして、皆様に厚く御礼申し上げます。
編集:これはクリック機能です。
$("#addproblementerbutton").click(function() {
$(function() { $( "#addproblemtable" ).dialog({
height: 550,
width: 600,
modal: true
});
});
});
ここにテーブル全体があります:
<!--start of hidden add problem table-->
<div id="addproblemtable" style="display:none" title="Add a Problem"><!--start of add problem div/table-->
<form id="addproblem">
<table id="addproblem" class="addproblemtable">
<tr>
<td style="width:200px; text-align:right;">ICD-9:</td>
<td><input id="icd9input" type="text"></td>
<td><button id="findbuttonicd9">FIND ICD-9</button></td>
</tr>
<tr>
<td style="width:200px; text-align:right;">Problem:</td>
<td><input id="problem" type="text"></td>
<td><button id="findbuttontext">FIND TEXT</button></td>
</tr>
<tr>
<td colspan="3">
<div id = "listicd9" style="width:100%; height:200px; overflow-y:scroll; margin-top:10px; margin-bottom:10px; background-color:#F1E2FE">
</div>
</td>
</tr>
<tr>
<td style="width:200px; text-align:right;">Date Noted:</td>
<td><input id="dateonset" type="text"></td>
<td></td>
</tr>
<tr>
<td style="width:200px; text-align:right;">Date Entered:</td>
<td><input id="dateentry" type="text"></td>
<td></td>
</tr>
<tr>
<td colspan="3">
<input type="radio" id="active" name="status" value="Active" checked="checked" />
<label class="styleradiobutton" for="active">Active</label></input>
<input type="radio" id="inactive" name="status" value="Inactive" />
<label class="styleradiobutton" for="inactive">Inactive</label></input>
</td>
</tr>
<tr>
<td colspan="3" style="width:200px; text-align:center;">
<input id="resetbutton" type="reset" value="RESET" class="formbutton"><!--reset the form-->
<input id="addproblemsubmitbutton" type="button" value="ADD" class="formbutton"></td>
</tr><!--add a problem button-->
<tr>
<td><div id=listicd9></div></td>
</tr>
</table>
</form>
</div><!--end of add problem div/table-->
これは、if/else/ajax を開始するためにクリックする .dialog テーブルの行です。
<tr>
<td style="width:200px; text-align:right;">ICD-9:</td>
<td><input id="icd9input" type="text"></td>
<td><button id="findbuttonicd9">FIND ICD-9</button></td>
</tr>
PS - デバッグで最初の if/else を通過できなかったため、.ajax 呼び出しを完了していません。まだそれに取り組んでいます。
ありがとう!