lorsque le texte a été modifié inputbox met automatiquement à jour les 6 zones de texte suivantes

J'ai 7 zones de texte. Si Top 1 zone de texte (Volume tous les ans) le texte a été modifié, le texte doit être mis à jour dans les 6 prochaines boîtes d'entrée (Dernière édition 2009 Volume au dernier 2014 volume). J'ai besoin de javascript ou Jquery pour cela. Je vais écrire Js textchanged() ou focuschange() pour la première zone de texte. Alors, que dois-je écrire dans focuschage() ou méthodes TextChanged()lorsque le texte a été modifié inputbox met automatiquement à jour les 6 zones de texte suivantes

<tr id="row12_136" class="RegText"> 
        <td style="width:420px;Padding-right:20px;">Volume All Years</td> 
        <td style="width:420px;Padding-left:0px;"> 
         <input name="12_136" type="text" maxlength="255" id="12_136" tabindex="61" title="Volume All Years" class="textbox" OnKeyPress="javascript:FocusChange();" style="width:300px;" /> 
        </td> 
       </tr><tr id="row12_60" class="RegText"> 
        <td style="width:420px;Padding-right:20px;">Latest 2009 Volume*</td> 
        <td style="width:420px;Padding-left:0px;"> 
         <input name="12_60" type="text" maxlength="255" id="12_60" tabindex="62" title="Latest 2009 Volume" class="textbox" OnKeyPress="javascript:FocusChange();" style="width:300px;" /> 
         <span controltovalidate="12_60" errormessage="* Required!" display="Dynamic" validationGroup="ValidateInsert" id="_ctl47" evaluationfunction="RequiredFieldValidatorEvaluateIsValid" initialvalue="" style="color:Red;display:none;">* Required!</span> 
        </td> 
       </tr><tr id="row12_61" class="RegText"> 
        <td style="width:420px;Padding-right:20px;">Latest 2010 Volume*</td> 
        <td style="width:420px;Padding-left:0px;"> 
         <input name="12_61" type="text" maxlength="255" id="12_61" tabindex="63" title="Latest 2010 Volume" class="textbox" OnKeyPress="javascript:FocusChange();" style="width:300px;" /> 
         <span controltovalidate="12_61" errormessage="* Required!" display="Dynamic" validationGroup="ValidateInsert" id="_ctl48" evaluationfunction="RequiredFieldValidatorEvaluateIsValid" initialvalue="" style="color:Red;display:none;">* Required!</span> 
        </td> 
       </tr><tr id="row12_62" class="RegText"> 
        <td style="width:420px;Padding-right:20px;">Latest 2011 Volume*</td> 
        <td style="width:420px;Padding-left:0px;"> 
         <input name="12_62" type="text" maxlength="255" id="12_62" tabindex="64" title="Latest 2011 Volume" class="textbox" OnKeyPress="javascript:FocusChange();" style="width:300px;" /> 
         <span controltovalidate="12_62" errormessage="* Required!" display="Dynamic" validationGroup="ValidateInsert" id="_ctl49" evaluationfunction="RequiredFieldValidatorEvaluateIsValid" initialvalue="" style="color:Red;display:none;">* Required!</span> 
        </td> 
       </tr><tr id="row12_63" class="RegText"> 
        <td style="width:420px;Padding-right:20px;">Latest 2012 Volume*</td> 
        <td style="width:420px;Padding-left:0px;"> 
         <input name="12_63" type="text" maxlength="255" id="12_63" tabindex="65" title="Latest 2012 Volume" class="textbox" OnKeyPress="javascript:FocusChange();" style="width:300px;" /> 
         <span controltovalidate="12_63" errormessage="* Required!" display="Dynamic" validationGroup="ValidateInsert" id="_ctl50" evaluationfunction="RequiredFieldValidatorEvaluateIsValid" initialvalue="" style="color:Red;display:none;">* Required!</span> 
        </td> 
       </tr><tr id="row12_64" class="RegText"> 
        <td style="width:420px;Padding-right:20px;">Latest 2013 Volume*</td> 
        <td style="width:420px;Padding-left:0px;"> 
         <input name="12_64" type="text" maxlength="255" id="12_64" tabindex="66" title="Latest 2013 Volume" class="textbox" OnKeyPress="javascript:FocusChange();" style="width:300px;" /> 
         <span controltovalidate="12_64" errormessage="* Required!" display="Dynamic" validationGroup="ValidateInsert" id="_ctl51" evaluationfunction="RequiredFieldValidatorEvaluateIsValid" initialvalue="" style="color:Red;display:none;">* Required!</span> 
        </td> 
       </tr><tr id="row12_65" class="RegText"> 
        <td style="width:420px;Padding-right:20px;">Latest 2014 Volume*</td> 
        <td style="width:420px;Padding-left:0px;"> 
         <input name="12_65" type="text" maxlength="255" id="12_65" tabindex="67" title="Latest 2014 Volume" class="textbox" OnKeyPress="javascript:FocusChange();" style="width:300px;" /> 
         <span controltovalidate="12_65" errormessage="* Required!" display="Dynamic" validationGroup="ValidateInsert" id="_ctl52" evaluationfunction="RequiredFieldValidatorEvaluateIsValid" initialvalue="" style="color:Red;display:none;">* Required!</span> 
        </td>

Source

2010-05-12 James123

Comment allez-vous les changer, ce qui signifie que les données devraient être mis en eux? Si les données sont récupérées ou calculées sur le back-end, il y a plus de travail impliqué. –

Je veux juste copier le texte de textbox1 à textbox2 ... textbox7. Il suffit de copier les données. – James123

Avec cette html, et où #foo est un sélecteur à zéro sur la table appropriée:

$('tr.RegText input:eq(0)').change(function() { 
    $('tr.RegText input:gt(0):lt(7)').val($(this).val()); 
});

Cela suppose que le changement sur le flou du premier champ d'entrée est acceptable. Changez pour le keyup ou n'importe quoi pour goûter.

Source

2010-05-12 02:32:53 wombleton

Désolé ... Wombleton .. Je ne comprends pas votre code. Ma table n'a pas d'identifiant. Cela n'a pas fonctionné pour moi. et un – James123

"#foo" est un espace réservé pour n'importe quel sélecteur css qui vous permet de trouver la table dans laquelle ces lignes sont. Cela ne fonctionnerait pas à moins que votre table ait l'ID "foo". S'il a une classe à la place ou un moyen de la trouver dans le DOM, vous pouvez l'utiliser à la place. Mise à jour du sélecteur pour utiliser tr.RegText à la place. – wombleton

utilisant jQuery:

$("#12_136").keyup(function(){ 
    var $myVal = $("#12_136").val(); 
    for(var i = 0; i < 6; i ++) { 
    $("#12_6"+i).val($myVal); 
    } 
});

Source

2010-05-12 02:40:31 rockstarrichg

Merci Rock, cela fonctionne bien. Est-il possible de changer # 12_136 et "# 12_6" + i et d'utiliser autre chose. comme utilisant le titre "Latest ..." – James123

Déposez votre événement keypress en ligne dans votre code HTML. Vous pouvez attacher facilement des gestionnaires d'événements à l'exécution.

Avec jQuery vous pouvez le faire avec ceci. J'utilise "onchange". Je ne pense pas que vous devez faire cela à un niveau de pression sur la touche.

$(document).ready(function() { init() }) 


function init() {  
    $('#12_136').change(function() { 
      var myVal = $(this).attr('value') 
      $(this).parents('table').find('input').attr('value',"#" + myVal + "#") 
    }) 
}

Source

2010-05-12 02:51:19

Merci Diodeus, j'ai d'autres entrées dans cette table. Je veux juste ajouter des valeurs aux prochaines 6 boîtes de saisie. Je pense que dans votre code, il va ajouter de la valeur à toutes les zones de texte d'entrée dans cette table. – James123

Il le fera. Vous pouvez sélectionner uniquement les six en leur ajoutant un nom de classe. Vous devez ensuite remplacer: .find ('input') avec .find ('input .yourClass') –

lorsque le texte a été modifié inputbox met automatiquement à jour les 6 zones de texte suivantes

Répondre

Questions connexes