- PR -

JavaScriptでTextBoxの合計

投稿者投稿内容
あーこ
会議室デビュー日: 2008/12/02
投稿数: 18
投稿日時: 2009-03-02 16:00
デューンさん、度々ありがとうございます。

Dim total as textbox=FormView1.Row.FindControl("sc_TextBox"+Lef(sender.ID,11))はコードミスで(sender.ID,2)でした。

デューンさんの認識で間違いありません。sc_TextBox1からsc_TextBox10までのIDの数字部分を取得して、その次に入力された値を取得したいです。

引用:

多分やりたいことは
IF Left(form1.elements[i].name,10) = "sc_TextBox" Then
だと思っていたのですが、違ってました?
↑でいいのであれば、Leftをmidに変換して、midからsubstrに変換(開始位置を一個ずらす)してみてください



上記の内容はJavaScriptに記述するのですか?
教えて頂いた事を自分なりにやってみたのですが、うまくいきません。
下記に修正したコードを記載しますので、どこが悪いか教えて下さい。
また、VB側には何も記述はいらないのでしょうか?

function check(txtTotal) {
var stat = true;
var txt = document.getElementById(txtTotal)
var c = 0;
for (i = 0; i < form1.elements.length; i++) {
if (mid(form1.elements[i].name,10 == "sc_TextBox")) {
if (form1.elements[i].name.substr(12, 2)) {
if (isNaN(form1.elements[i].value)) stat = false;
c = c + 1 * form1.elements[i].value;

}
}

txt.value = c;
return stat;

}
}
まるく
大ベテラン
会議室デビュー日: 2004/01/09
投稿数: 181
投稿日時: 2009-03-02 16:24
似たようなソースをインターネットから探すのもいいけど、最終的には自分が作ったものが何をしているのか理解しないと解決しません。

1行ずつ理解していった方が最終的には早いんではないか、と。

また、一気に仕様を盛り込みすぎるとややこしくなるので、まずは、全 TextBox に値が必ず入っているものとして、それで動作するサンプル作り、動いたら次のステップに進むなど工夫しましょう。

デューン
大ベテラン
会議室デビュー日: 2004/04/21
投稿数: 174
お住まい・勤務地: Tokyo
投稿日時: 2009-03-02 16:43
ごめんなさい、書き方が悪かったようです。

javascriptでのform1.elements[i].name.substr(11, 2)は
VB では mid(form1.elements[i].name,12,2)となります

javascriptにはmidはありませんが、この二つは似ています。
(ですので変換するのが容易だと思います)

一方で、VBでのLeft関数は、VBのMid関数に変換可能ですから
1.VBのLeftでやろうとしていたことをVBのMid関数で記述してみる
2.そのVBのMid関数をjavascriptのsubstrに変換する
というプロセスの方が考えやすいかと思ったのですが、ちょっと回りくどいかもしれませんね。



さて、数値部分を取得したいのであれば、substr(10,2)になります
(substrは先頭が0なので)


そして現状での問題は、
if ( form1.elements[i].name.substr(10,2) == "sc_TextBox" )の箇所と、
加算処理が常に実行してしまう事だと思います。


if ( form1.elements[i].name.substr(10,2) == "sc_TextBox" ) は、
・IDの数値部分を取得する
・それが本当に対象のTextBoxかチェックする
がごっちゃになってしまっていませんか?。

加算処理の方はコメントを参照ください。


コメントを足したコードを追加しておきます。
# midに関しては直しておきました。

コード:

function check(txtTotal) {
var stat = true;
var txt = document.getElementById(txtTotal) // セミコロン
var c = 0;
for (i = 0; i < form1.elements.length; i++) {
if ( form1.elements[i].name.substr(10,2) == "sc_TextBox" ) {
// ↑ form1.elements[i].nameの11文字目から取り出した 2文字と "sc_TextBox" (10文字)を比較している
// ここでやりたかった判定はなんでしょうか?
if (form1.elements[i].name.substr(12, 2)) {
// ↑ は不要?
if (isNaN(form1.elements[i].value)) stat = false;
c = c + 1 * form1.elements[i].value;
// ↑ if文にかかっていない(中括弧にくくられていない)ので、
//isNaNかどうかに係らずcの計算処理が走ります
}
}
}
txt.value = c;
return stat;
}
} // ←一個多いかも?





[ メッセージ編集済み 編集者: デューン 編集日時 2009-03-02 16:45 ]
ぴあちゃん
ぬし
会議室デビュー日: 2008/02/07
投稿数: 287
投稿日時: 2009-03-02 23:13
VB の Mid は確かに抽出という観点では substr に似てるけど、
今回の場合は抽出なんかしないで、あるかどうかを見ればいい
のだから、それにふさわしいのは、indexOf でしょう。

VB の Mid/left/right はさっさと忘れて、substring/indexOf/lastIndexOf
に慣れましょう。JavaScript は、substr と substring 2つありますので
全部で4つですね。
substr と substring は、引数1個と2個取るケースがあり、
前者が A 地点以降の文字全部 又は、A 地点から N 文字抽出、<<Mid に似てる
後者が、A 地点以降の文字全部 又は、A 地点からB地点-1 まで抽出です。
微妙に違いますが使い分けると便利ですね。

if (form1.elements[i].id.indexOf("sc_TextBox") > -1) {
//なにか処理
}




[ メッセージ編集済み 編集者: ぴあちゃん 編集日時 2009-03-02 23:14 ]
あーこ
会議室デビュー日: 2008/12/02
投稿数: 18
投稿日時: 2009-03-03 08:07
みなさん、ありがとうございます。

難しいです。
FormViewのDataBoundからFindControlを使い、
ひとつづつTextBoxを指定すると合計は出るのですが
TextBoxが多くあるとその分FindContorolを入力しなくてはならないので、
JavaScriptにて指定するTextBoxをループさせて合計を出したいと思いました。

勉強不足は重々承知なのですが、
やはりサーバ側でIDを変換させてからJavaScriptで動作させないといけないのでしょうか?
デューン
大ベテラン
会議室デビュー日: 2004/04/21
投稿数: 174
お住まい・勤務地: Tokyo
投稿日時: 2009-03-03 09:44
話が少々飛び飛びになっている気がしますが、

引用:

TextBoxが多くあるとその分FindContorolを入力しなくてはならないので


FindControlの引数は文字列ですので、IDが一定の形式に従っているのであれば
ループにすることは可能だと思います。

引用:

JavaScriptにて指定するTextBoxをループさせて合計を出したいと思いました


javascriptにて合計を算出して表示するのはユーザビリティの向上にはいいですが、
サーバ処理の代替と考えるのは危険です。
サーバーに返ってきた合計値が必ずしも正しくないことを認識しておいてください。
※ 計算間違いがおきるという意味ではなくて、書き換えることが可能だからです。


引用:

やはりサーバ側でIDを変換させてからJavaScriptで動作させないといけないのでしょうか?


これはどこから出てきた話でしょう?
ただ、ClientIDやUniqueIDを使用するという意味では、文字リテラルを意識しなくてよくなる事は大きな利点です。

あーこ
会議室デビュー日: 2008/12/02
投稿数: 18
投稿日時: 2009-03-03 10:09
ごちゃごちゃになり申し訳ありません。

現在は下記のコードで希望する動作は出来ています。
コード内のTextBoxは2つしか記述していませんが、これが計10個あります。

各コード内に10個分のTextBoxの内容を記述するよりはループさせて指定するIDを取得し、取得されたIDに入力されている数値を足して合計を表示させた方がコードがすっきりすると思いコードをすっきりさせる記述が知りたくて質問しました。

入力するTextBoxのIDは「sc_TextBox1」〜「sc_TextBox10」まであり、
最後の数字部分以外は同じなので、ループを使用できると思いました。

この様な合計の出し方はJavaScriptで行わない方が良いのでしょうか?

JavaScriptコード

function total(TXT1,TXT2,TOTAL) {
var txt1 = document.getElementById(TXT1).value;
var txt2 = document.getElementById(TXT2).value;
var total = document.getElementById(TOTAL);
var sum;

if (!(txt1 == "") && !isNaN(txt1)) { sum = parseInt(txt1) }
if (!(txt2 == "") && !isNaN(txt2)) { sum = sum + parseInt(txt2) }

total.value = sum;
}


VBコード

Protected Sub FormView1_DataBound(ByVal sender As Object, ByVal e As System.EventArgs) Handles FormView1.DataBound

Dim txt1 As TextBox = CType(FormView1.FindControl("sc_TextBox1"), TextBox)
Dim txt2 As TextBox = CType(FormView1.FindControl("sc_TextBox2"), TextBox)
Dim txt As TextBox = CType(FormView1.FindControl("totalTextBox"), TextBox)

txt1.Attributes.Add("onchange", [String].Format("total(""{0}"",""{1}"",""{2}"");", txt1.ClientID, txt2.ClientID, txt.ClientID))
txt2.Attributes.Add("onchange", [String].Format("total(""{0}"",""{1}"",""{2}"");", txt1.ClientID, txt2.ClientID, txt.ClientID))

End Sub
King
ぬし
会議室デビュー日: 2008/06/20
投稿数: 284
投稿日時: 2009-03-03 10:13
引用:

・テキストボックスの入力値を取得する処理
・複数の値の合計を計算する処理
・テキストボックスに任意の値を表示する処理

を一度別々に考えてみます。


考えました?

なんかグダグダになって来てるようなので
悪いですけど簡単なコードを書きます。
求めているコードとは違うかも知れませんが。

コード:
// テキストボックスの入力値を取得する処理
var i = 0;
for (i=1; i<=10; i++)
{
    alert(document.getElementById("sc_TextBox" + i.toString()).value);        
}

// 複数の値の合計を計算する処理
var a = 1;
var b = 2;
var c = 3;
alert(a + b + c);

// テキストボックスに任意の値を表示する処理
document.getElementById("totalTextBox").value = "total";

スキルアップ/キャリアアップ(JOB@IT)