動的にID付与した要素を、関数側でも認識させたい。
質問:
動的にID付与した要素名が、関数側で認識できていない原因、対策をご教示頂けますでしょうか?
達成したいことのイメージ:
以下のコーディングでは、ID付与した要素の入力内容に問題があった場合、画面に対し
①エラーメッセージを出力
②その要素の背景を変える
ことを達成しようとしています。
上記①②は双方エラー処理用の関数で達成しようとしていて
背景を変更したい要素名について引数で渡しているつもりですが、関数側でうまく捉えられいないようです。
問題の要素の背景色が変わってくれません。
尚、画面が開かれた際からIDが設定された要素を試しに引数に与えると
エラー処理用の関数は 無事動作=当該要素の背景色を変えることができます。
ブラウザ(IE)の開発ツール=DOM Explorerで、動的に追加したID名が問題のINPUT要素に見受けられない。しかし関数を呼び出す側で、試しにID指定で当該要素の値をメッセージボックスに表そうとすると、無事表示することができます。
毎回初歩的に思われる問い合わせを掲載してしまい、申し訳ありません。
何卒よろしくお願い申し上げます。
-html-
<table>
<tr>
<td><input type="text" name="cd" style="width:45px;"></td>
<td><label name="name"></label></td>
<td><input type="text" name="amount" style="width:45px;"></td>
<td><label name="unitp"></label></td>
<td><label name="totalp"></label></td>
</tr>
</table>
-JavaScript(jquery-3.2.1.min.js)-
$("input[name=cd]").on("blur",function() {
var label = $(this).parent().parent().find("label");
$(this).attr("id","99"); // ←【ID付番号】
alert($("#99").val()); // ←【内容を表示できる】
$.ajax({
url: "cdinfoget.php",
type: "POST",
dataType: "json",
data: {
maker_no: maker_val
}
})
.done(function(data){
if (data.length <= 0) {
label.eq(0).html("");
label.eq(1).html("");
label.eq(2).html(""); downtotalCalc();
errhandler($("#99"), true, "err#005"); // ←【ID付番した要素も引数に与え、エラー処理の関数呼出し】
$("#99").removeAttr("id");
return false;
}
....省略
});
//****エラー処理用の関数****
function errhandler ($obj, onoff, errno) {
var errmsg = "[" + errno + "]" + "\n\n";
switch(errno){
case "err#005" :
errmsg = errmsg + "品名コードの指定が誤っています!";
break;
case "err#014" :
errmsg = errmsg + "単価の参照に失敗しました!";
break;
case "err#015" :
errmsg = errmsg + "日付の指定が誤っています(休日?)!";
break;
}
//第2引数=true ⇒ エラー /メッセージと背景色サーモンに。
//第2引数=false ⇒ エラー解除/背景色は戻す。。
if (onoff) {
$obj.css("background-color","#FA8072");
alert(errmsg)
} else {
$obj.css("background-color","#EEFFFF");
}
}