フォームブリッジで編集不可にしたい。

フィールドを編集不可にしたい。

https://developer.cybozu.io/hc/ja/community/posts/900001359003-%E3%83%95%E3%82%A3%E3%83%BC%E3%83%AB%E3%83%89%E3%82%92%E7%B7%A8%E9%9B%86%E4%B8%8D%E5%8F%AF%E3%81%AB%E3%81%97%E3%81%9F%E3%81%84?input_string=%E3%83%95%E3%82%A9%E3%83%BC%E3%83%A0%E3%83%96%E3%83%AA%E3%83%83%E3%82%B8%E3%81%A7%E7%B7%A8%E9%9B%86%E4%B8%8D%E5%8F%AF%E3%81%AB%E3%81%97%E3%81%9F%E3%81%84%E3%80%82

 

上記URLを元に、編集不可にしてみました。

文字列1行および文字列複数行は編集不可にできましたが、

ただ、ドロップダウンリストと数値項目とトグルボタンは編集不可にできませんでした。

readOnlyでセットしてみましたが、文字列はできるけど他のはできないという状況です。

    inputElement = document.querySelector(‘[data-vv-name=“Writer”] > *’);

    inputElement.setAttribute(“disabled”, “disabled”);

    

    inputElement = document.querySelector(‘[data-vv-name=“MailAddress”] > *’);

    inputElement.setAttribute(“readOnly”, true);

 

一番実現したいことは、あるドロップダウンリストが「編集不可」となっていたら

すべて入力できないようにしたいです。

上の書き方ですと、編集不可にしたいボックスを全部一つづつコード入力しないといけないので、

まとめて一気に編集不可にする方法があれば教えて下さい。

 

どのように記述すればいいのでしょうか?ご教授のほどよろしくお願いいたします。

下記のように記述したら、入力不可になりました。

 

   var aaa = document.querySelectorAll(‘input’);

    console.log(aaa.length);

    document.querySelectorAll(“input”).forEach( e => e.disabled = true );

    aaa = document.querySelectorAll(‘textarea’);

    console.log(aaa.length);

    document.querySelectorAll(“textarea”).forEach( e => e.disabled = true );

    aaa = document.querySelectorAll(‘span’);

    console.log(aaa.length);

    document.querySelectorAll(“span”).forEach( e => e.disabled = true );

 

しかし、数値の+ボタンとーボタン

ドロップダウンリストについては、クリックすると入力不可が解除されてしまいます。

これらのボタンを無効化するにはどうしたらいいでしょうか?

 

ご教授お願いいたします。

このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。