0

ユーザーがユーザーIDを選択した後、ユーザーIDが最初の読み取り専用テキストボックスに表示され、最初の読み取り専用テキストボックスにonChange表示されたときにイベントが発生して、このユーザーIDを2番目のテキストボックスにコピーできるようにする必要があります。ただし、機能しません。最初のテキストボックスにユーザーIDが表示されるだけで機能しますが、2番目のテキストボックスではonChangeがトリガーされません。

ここで半分の作業コード:

<tr>
    <td align="right">
        Secondary Owner
    </td>
    <td>
        <input id="Hidden1" type="hidden" />
        <asp:TextBox ID="tbAdd_Sowner" runat="server" Enabled="false"></asp:TextBox>
        <input id="Hidden2" type="hidden" />
        <input id="Hidden3" type="hidden" />
        <a href="javascript:void(0)" onclick="GalModalTOCCDialog(Hidden1, tbAdd_Sowner, Hidden2,Hidden3)">
            Get User ID</a>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator7" ValidationGroup="g1" runat="server" ErrorMessage="* Required" ControlToValidate="tbAdd_Sowner"> <b style="color:Red;"> * </b></asp:RequiredFieldValidator>
        <asp:ValidatorCalloutExtender ID="ValidatorCalloutExtender8" runat="server" TargetControlID="RequiredFieldValidator7">
        </asp:ValidatorCalloutExtender>
    </td>
</tr>
<tr>
    <td align="right">Secondary Owners</td>
    <td>
        <asp:TextBox ID="tbAdd_Sphone" runat="server"></asp:TextBox>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator13" ValidationGroup="g1" runat="server" ErrorMessage="* Required" ControlToValidate="tbAdd_Sphone"> <b style="color:Red;"> * </b></asp:RequiredFieldValidator>
        <asp:ValidatorCalloutExtender ID="ValidatorCalloutExtender9" runat="server" TargetControlID="RequiredFieldValidator13">
        </asp:ValidatorCalloutExtender>
    </td>
</tr>

<head>次に、最初のテキスト ボックスの値をコピーして 2 番目のテキスト ボックスに配置するJavaScript コードを入力します。

 <script>
        function getUserID() {
            document.getElementById('tbAdd_Sphone').value = document.getElementById('tbAdd_Sowner').value;
        }

document.getElementById('tbAdd_Sowner').onchange = getUserID();

            </script>

編集: GALModalDialog.js のコードをここに追加します。また、選択するユーザー ID をリストした GALToCCDialong.asp と、AD からユーザー ID を取得する XMLGALListbox.asp もあります。

function PopulateListboxFromString(oListbox,vNames,vUserIDs){

    var oArrayUserNames = vNames.value.split(';');
    var oArrayUserIDs = vUserIDs.value.split(';');

    for (var index=0;index < oArrayUserIDs.length;index++) {

        if (oArrayUserNames[index] != ''){
            var oOption = document.createElement("OPTION");
            oListbox.options.add(oOption);
            oOption.innerText = oArrayUserNames[index];
            oOption.value = oArrayUserIDs[index];
        }
    }   
};

function GalModalTOCCDialog(oTONames, oTOUserIDs,oCCNames, oCCUserIDs ) {


        if (oCCNames != null){

            var oInputArray = new Array(oTONames.value,oTOUserIDs.value,oCCNames.value,oCCUserIDs.value);

        } else {

            var oInputArray = new Array(oTONames.value,oTOUserIDs.value,'','');

        }

        var oOutputArray = window.showModalDialog('GalAccess/GALToCCDialog.asp', oInputArray, 'dialogWidth:510px;dialogHeight:400px;status:no;help:no;');





        // Check if we get something back; 
        // User might have closed the window without using the buttons
        if (oOutputArray != null){

            //first element is true if user clicked OK

            if (oOutputArray[0]) {

                if (oCCNames != null){

                    oTONames.value = oOutputArray[1];
                    oTOUserIDs.value = oOutputArray[2];
                    oCCNames.value = oOutputArray[3];
                    oCCUserIDs.value = oOutputArray[4];

                } else {

                    oTONames.value = oOutputArray[1];
                    oTOUserIDs.value = oOutputArray[2];     
                }



            } 
        }

    return false;
}

function GalModalDialog(oSelectObject, oUserID) {

    if (oUserID == null){
        // there is a select object to fill data from
        // fill the input array
        var oInputArray = new Array(new Array(oSelectObject.options.length),new Array(oSelectObject.options.length));

        for (var index=0;index < oInputArray[0].length;index++) {
            oInputArray[0][index] = oSelectObject.options[index].innerText;
            oInputArray[1][index] = oSelectObject.options[index].value;

        };

        var oOutputArray = window.showModalDialog('../GALDialog/GALModalDialog.asp', oInputArray, 'dialogWidth:500px;dialogHeight:320px;status:no;help:no;');

        // Check if we get something back; 
        // User might have closed the window without using the buttons
        if (oOutputArray != null){

            //first element is true if user clicked OK

            if (oOutputArray[0]) {
                //remove existing from end to beginning otherwise not all options are removed.

                var length=oSelectObject.options.length;
                for (var index=length-1;index >= 0;index--) {
                    oSelectObject.options[index] = null;
                };

                // copy the array   
                for (var index=0;index < oOutputArray[1].length;index++) {
                    var oOption = document.createElement("OPTION");
                    oSelectObject.options.add(oOption);
                    oOption.innerText = oOutputArray[1][index];
                    oOption.value = oOutputArray[2][index];

                };
            } 
        }
    } else
    {
        // there are 2 text objects to fill data from; the first contains the name, the secound the userid.
        //if (oSelectObject.value != '' ) {
        //  var oInputArray = new Array(new Array(1),new Array(1));
        //
        //  oInputArray[0][0] = oSelectObject.value;
        //  oInputArray[1][0] = oUserID.value;

        //} else {

                var oInputArray = new Array(new Array(0),new Array(0));

        //}     
        var oOutputArray = window.showModalDialog('../GALDialog/GALModalDialog.asp', oInputArray, 'dialogWidth:500px;dialogHeight:320px;status:no;help:no;');

        if (oOutputArray != null){

            //first element is true if user clicked OK

            if (oOutputArray[0]) {

                // copy the data    
                oSelectObject.value = oOutputArray[1][0];
                oUserID.value = oOutputArray[2][0];


            } 
        }
    }
    return false;
}

編集:ここに GALToCCDialog.asp のコードがあります。SubmitOnclick関数内で、else if(vAction == 'OK')選択したユーザーIDから[OK]ボタンをクリックしてテキストボックスに送信します。

<SCRIPT ID=clientEventHandlersJS LANGUAGE=javascript>
<!--

function List_onkeydown(oList) {

    if( event.keyCode == 46 ){

        if ((oList.selectedIndex != -1)&&(oList.options[oList.selectedIndex].value != '')){
            oList.options[oList.selectedIndex] = null;

        }
    }
}

//-->
</SCRIPT>


<script language="jscript">



function InitializeListbox(idXML, idSpan){

    // get to the XML specifying the names
    var oSelects;
    var strXML;

    oSelects  = idXML.XMLDocument.documentElement.childNodes;
    strXML = '';
    // Get all the options in 1 string
    for (var index=0;index< oSelects.length;index++){
        strXML = strXML + oSelects[index].xml;
    }
    // the error handlingis there if idSpan refers to multiple objects

    // Insert the options in the html before the end of the SELECT
    // window.alert(strXML);
    //idSpan.innerHTML = replace(idSpan.innerHTML,"</SELECT>",strXML & "</SELECT>");
    idSpan.innerHTML = '<SELECT id=idUserSelect size=12 style="width:190px">' + strXML + '</SELECT>';
}

function SubmitOnclick(vAction, oObject){

    //DistList.action = "DistList.asp?Action=" & vAction ;

    if (vAction == 'Add'){

        if ((idUserSelect.value!='')&&(idUserSelect.value!='Unknown')){
            var oOption = document.createElement("OPTION");
            oObject.options.add(oOption);
            oOption.innerText = idUserSelect.options[idUserSelect.selectedIndex].text;
            oOption.value = idUserSelect.options[idUserSelect.selectedIndex].value;
        }
    }   else if(vAction == 'Find') {
        idXMLUsers.src ='XMLGALListbox.asp?Searchstring=' + SearchString.value;

    } else if(vAction == 'Remove'){

        if ((idMyList.selectedIndex != -1)&&(idMyList.options[idMyList.selectedIndex].value != '')){
            idMyList.options[idMyList.selectedIndex] = null;
        }
    } else if(vAction == 'OK'){

        //window.returnValue = cal.day + ' ' + MonthNames[cal.month-1] + ' ' + cal.year ;
        // create an array

        var TONames = ''
        var TOUserIDs = ''
        var CCNames = ''
        var CCUserIDs = ''

        for (var index = 0; index < 1; index++) {
            TONames = TONames + idTOList.options[index].innerText;
            TOUserIDs = TOUserIDs + idTOList.options[index].value;
        };

        //Commented out by Nick, use if you want multiple userIDs etc...
        //for (var index=0;index < idTOList.options.length;index++) {
        //  TONames = TONames + idTOList.options[index].innerText  ;
        //  TOUserIDs = TOUserIDs + idTOList.options[index].value ;         
        //};

        //for (var index=0;index < idCCList.options.length;index++) {
            //CCNames = CCNames + idCCList.options[index].innerText ;
            //CCUserIDs = CCUserIDs + idCCList.options[index].value ;

        //};

        var oArray = new Array(true,TONames,TOUserIDs,CCNames,CCUserIDs);

        window.returnValue = oArray;

        //window.alert(TONames);
        //window.alert(TOUserIDs);
        //window.alert(CCNames);
        //window.alert(CCUserIDs);

        window.close();

    } else if(vAction == 'Cancel'){
        var oArray = new Array(false);
        window.returnValue = oArray;
        window.close();

    }   

}

function OnBodyLoad() {

    //window.alert('test');
    //clear all list data

    try{
        var oArray = window.dialogArguments;

        //PopulateListboxFromString(idTOList,oArray[0],oArray[1])
        //PopulateListboxFromString(idCCList,oArray[2],oArray[3])

    } catch(e)
    {
    }

};

function PopulateListboxFromString(oListbox,vNames,vUserIDs){

    var oArrayUserNames = vNames.split(';');
    var oArrayUserIDs = vUserIDs.split(';');
    for (var index=0;index < oArrayUserIDs.length;index++) {

        if (oArrayUserNames[index] != ''){
            var oOption = document.createElement("OPTION");
            oListbox.options.add(oOption);
            oOption.innerText = oArrayUserNames[index];
            oOption.value = oArrayUserIDs[index];
        }
    }   

};

function OnBodyLoad__() {

    //window.alert('test');
    try{
        var oArray = window.dialogArguments;

        for (var index=0;index < oArray[0].length;index++) {
            var oOption = document.createElement("OPTION");
            idMyList.options.add(oOption);
            oOption.innerText = oArray[0][index];
            oOption.value = oArray[1][index];

        };
    } catch(e)
    {

    };
};

</script>
<body class="cellcolorlightest content" onload="OnBodyLoad();">
<xml id="idXMLUsers" src="XMLGALListbox.asp?Searchstring=" ondatasetcomplete="InitializeListbox(idXMLUsers, idUsers);"></xml>

    <table class="TableBorderNormal" width="100%" border=0 cellspacing="1" cellpadding="1">
    <colgroup>
        <col width="50%"></col><col></col><col width="50%"></col>
        <thead>

        <tr>
         <td colspan="3" class="TDvwvInfo" align="left"><STRONG>Find Name</STRONG><br><FONT size=2>Type name and hit "Search"</FONT></td>
        </tr>

        <tr>
         <td  class="TDvwvInfo" align="left"><input name="SearchString" style="WIDTH: 190px" size="20"> &nbsp;</td>
         <td class="TDvwvInfo" align="middle" valign=top><input  type="button" value="Search" name="Find" onclick="SubmitOnclick('Find')"></td>
         <td class="TDvwvInfo" align="left"></td>
        </tr>

        <tr>
         <td class="TDvwvInfo" align="left" nowrap><STRONG>Users found</STRONG><br><FONT size=2>Select from list and hit "Select" to add</FONT></td>
         <td class="TDvwvInfo" align="middle"></td>
         <td class="TDvwvInfo" align="left" valign=top><STRONG>Get User ID</STRONG><br></td>
        </tr>

        </thead>

        <tr>
         <td class="TDvwv" align="left" width="33%" rowspan=2  valign=top><span id="idUsers">   </span> </td>               
         <td class="TDvwvInfo" align="middle" valign=top width="33%">
         <input  type="button" value="Select &gt;" name="Add" onclick="SubmitOnclick('Add', idTOList);"><br><br>&nbsp;
         </td>
         <td class="TDvwv" align="left" width="33%"  valign=top>
          <select id="idTOList" size="5" style="WIDTH: 190px" LANGUAGE=javascript onkeydown="return List_onkeydown(this)"> </select><br>&nbsp;
          <br />
          <b style="color:red">* Only add one user, if you added the wrong user click cancel and try again.</b>
          </td>
        </tr>

            <tr>
                 <td align=middle  valign=top>
                 <!-- <input type="hidden" value="CC  >" name="CC" onclick="SubmitOnclick('Add', idCCList);" disabled="disabled"><br><br>&nbsp;--> <!--INPUT name=Remove onclick="SubmitOnclick('Remove');" type=button value="  < Remove"--></td>
                 <td align=left  valign=top>
                  <!--<select id=idCCList size=5 style="WIDTH: 190px" LANGUAGE=javascript onkeydown="return List_onkeydown(this)" disabled="disabled" visible="false"></select></td>-->

            </tr>

        <tr>
         <td align="middle" ></td>
         <td align=middle></td>
         <td align=left>
          <input type="button" value="OK" name="OK" onclick="SubmitOnclick('OK',null);">&nbsp;&nbsp;
          <input type="button" value="Cancel" name="Cancel" onclick="SubmitOnclick('Cancel',null);"></td>
        </tr>
    </table>

</body>
</html>
4

5 に答える 5

1

tbAdd_SownerJavaScript を使用して (関数を使用すると仮定します)の値を変更しても、イベントGalModalTOCCDialogは発生しません。onchange

値を設定した後、そのイベントを手動で発生させることができます。

document.getElementById('tbAdd_Sowner').onchange();

getElementById@IrfanTahirKheli が示したような問題が発生していないことに驚いていますが、これは問題なく機能するはずでした...そのため、マークアップの一部が欠落している可能性があり、正しく支援する必要があります。

他に強く考慮する必要があるのは、インライン スタイルを使用しないことと、書式設定にテーブルを使用しないことです。

私が追加したものに問題があるようですので、別の方法があります。を削除して、JavaScript からすべて実行しonChangeます。asp:TextBox

 document.getElementById('tbAdd_Sowner').value = 'somevalue';
 document.getElementById('tbAdd_Sowner').onchange = getUserID();
于 2013-09-27T15:21:32.207 に答える
1

使用する

document.getElementById('<%= tbAdd_Sphone.ClientID %>')

それ以外の

document.getElementById('tbAdd_Sphone')

MSDN Control.ClientID プロパティ

于 2013-09-23T18:20:52.623 に答える
1

javascript から値を設定するだけでは、変更イベントを作成できません。これはトリガーを使用したサンプルです。

 <script>
       $(document).ready(function () {

           $(".tbAdd_Sowner").on('change', function () {
               var owner = $('.tbAdd_Sowner').val();
               $('.tbAdd_Sphone').val(owner);
           });

           $(".aGetID").on('click', function () {
               var tbOwner = $('.tbAdd_Sowner');
               var hidden1 = $('.Hidden1');
               var hidden2 = $('.Hidden2');
               var hidden3 = $('.Hidden3');
               GalModalTOCCDialog(hidden1, tbOwner, hidden2, hidden3);

           });

           function GalModalTOCCDialog(Hidden1, tbAdd_Sowner, Hidden2, Hidden3) {
               $(tbAdd_Sowner).val(' ').trigger('change');
           }

           $('.tbAdd_Sowner').change(function () {
               $(this).removeAttr('disabled');

           });
       });
    </script>

これらのバリデータを削除するコードは次のとおりです

<table>
        <tr>
            <td align="right">Secondary Owner
            </td>
            <td>
                <input id="Hidden1" type="hidden" value="1" class="Hidden1"  />
                <asp:TextBox ID="tbAdd_Sowner" OnTextChanged="tbAdd_Sowner_TextChanged" CssClass="tbAdd_Sowner" AutoPostBack="true" runat="server" Enabled="false"   ></asp:TextBox>
                <input id="Hidden2" type="hidden" class="Hidden2" />
                <input id="Hidden3" type="hidden" class="Hidden3" />
                <a href="javascript:void(0)" id="aGetID" class="aGetID" >Get User ID</a>

            </td>
        </tr>
        <tr>
            <td align="right">Secondary Owners</td>
            <td>
                <asp:TextBox ID="tbAdd_Sphone" runat="server" CssClass="tbAdd_Sphone" ></asp:TextBox>

            </td>
        </tr>
    </table>

サーバ側。

protected void tbAdd_Sowner_TextChanged(object sender, EventArgs e)
        {
            tbAdd_Sowner.Text = "123";
        }
于 2013-09-27T13:41:19.190 に答える
0

これを使って<asp:TextBox ID="TextBox1" runat="server" onkeypress="document.getElementById('id').Value=this.value;" />

于 2013-09-30T19:55:41.020 に答える
0

他の人が回答で述べたように、

  <asp:TextBox id="tbAdd_Sphone" runat="server" />

生成された HTML の前に、サーバー側の動的クライアント ID が付けられます。任意のブラウザーでページのソース コードを表示する (または開発者ツールを使用する) と、ID がメソッド呼び出しに渡すものとは異なることがわかります。つまり、次のようなものです。

<textarea id="ctl00_OuterASPControlID_tbADD_Sphone"></textarea>

クラスにも動的にプレフィックスが付けられている場合は、class="tbAdd_Sphone" を使用して className を静的に保つことができます。または、ID で要素を取得してみてください

<%=tbAdd_Sphone.ClientID %>

ClientID モードを staticに設定するか、UniqueID を使用してみてください。

もう 1 つ注意すべき点は、javascript には特別な動作があります。呼び出しで正しく渡された変数のセット数を使用してメソッドを呼び出すと、機能でそれらの値のみが使用されます。呼び出しに null/未定義のデータが渡された場合、残りのパラメーターは単に無視されます。

functionName:function(parameter1, parameter2) { 

            //Default behavior can be overridden if parameter2 is not passed in as expected.
            if(parameter2 ==null || parameter2=='undefined') { 
                parameter2 = "Some value"; 
                    } 
}


    functionName("testPar1");               //Works but parameter2 is not passed in as expected
    functionName("testPar1", "testPar2");   //Works
    functionName("testPar1", undefined);    //Works, but parameter2 is not passed in as expected

電話の ID を使用する必要がある場合は、実際の ID で要素を取得するために部分文字列検索を行うか、JavaScript で getElementsByTag を使用してテキスト ボックスを検索します。プレーンな Javascript で言うと、他のプロパティを使用できます。

var x = document.getElementsByTag("textbox"); 
if(x!=null && x.attribute('class') == 'tbAdd_Sphone' )  { 
 var valueX = x.attribute('value'); 
}
于 2013-10-02T17:35:00.890 に答える