javascript - Copy value of textboxes to another textboxes inside a dynamic form -


i have textboxes on upper part of ui , dynamic form below contains same name , should have same value. need have copy button on dynamic form , copy value input dynamic form below. using angularjs. how can possibly that?

my html form this:

   <div class="form-group">                                                 <label class="col-md-6 control-label">brand name: </label>      <div class="col-md-6">                                                   <input type="text" class="form-control" ng-required="true" name="bname" id="bname" class="form-control" ng-model="languageitem.bname" required/>      </div>     </div><br/><br/><br/>    <div class="form-group">                                                 <label class="col-md-6 control-label">product name: </label>      <div class="col-md-6">                                                   <input type="text" class="form-control" name="pname" ng-required="true" id="pname" ng-model="languageitem.pname" required/>      </div>     </div><br/><br/><br/>    <div class="form-group">                                                 <label class="col-md-6 control-label">product name sub: </label>      <div class="col-md-6">                                                   <input type="text" class="form-control" name="pnamesub" ng-required="true" id="pnamesub" ng-model="languageitem.pnamesub" required/>      </div>     </div><br/><br/><br/>

i need copy input value of textboxes dynamic form below on button click

    <div class="text-left"><h3>new languagessssss <button  class="btn btn-primary pull-right" type="button" ng-click="removelanguageitem(languageitem)" value=""><span class="fa fa-minus"></span></button>&nbsp;<button  class="btn btn-primary pull-right" type="button" ng-click="addlanguageitem()" value="" /><span class="fa fa-plus"></span></button></h3></div><br/> <legend> </legend>        <div class="col-md-12" class="pull-right" >                                                                                                       <button  class="btn btn-primary pull-right" type="button" ng-click="copytext()" id="copytext" value="">copy</button>                                                          </div>   <div id="web" ng-repeat="languageitem in languageformdata.language">         <div class="row col-xs-12">           <div class="col-xs-6">             <br/><br/>             <div class="form-group">                                                          <label class="col-md-6 control-label">brand name: </label>               <div class="col-md-6">                                                            <input type="text" class="form-control" ng-required="true" name="bname" id="bname" class="form-control" ng-model="languageitem.bname" required/>               </div>              </div><br/><br/><br/>             <div class="form-group">                                                          <label class="col-md-6 control-label">product name: </label>               <div class="col-md-6">                                                            <input type="text" class="form-control" name="pname" ng-required="true" id="pname" ng-model="languageitem.pname" required/>               </div>              </div><br/><br/><br/>             <div class="form-group">                                                          <label class="col-md-6 control-label">product name sub: </label>               <div class="col-md-6">                                                            <input type="text" class="form-control" name="pnamesub" ng-required="true" id="pnamesub" ng-model="languageitem.pnamesub" required/>               </div>              </div><br/><br/><br/>           </div>           <div class="col-xs-6">             <br/><br/>             <div class="form-group">                   <label class="col-md-6  control-label">featuressss: </label>               <div class="col-md-6">                                                            <!--  <input type="text" class="form-control" name="lfeature" ng-required="true" id="lfeature" ng-model="languageitem.lfeature" required/> -->                   <textarea rows="1" cols="25" class="form-control" style="border-color: #ff69b4; color:#ff1493; border-radius: 5px; height: 50px;" ng-model="pfeatureedit" name="lfeature" id="lfeature"  ng-model="languageitem.lfeature" required></textarea>                 <textarea rows="1" cols="25" class="form-control" style="border-color: #ff69b4; color:#ff1493; border-radius: 5px; height: 50px;" ng-model="pfeatureedit" name="pfeatureedit" id="pfeatureedit"></textarea>               </div>               </div><br/><br/>             <div class="form-group">                   <label class="col-md-6  control-label">ingredient: </label>               <div class="col-md-6">                                                            <input type="text" class="form-control" name="lingredient" ng-required="true" id="lingredient" ng-model="languageitem.lingredient" required/>               </div>               </div><br/><br/>             <div class="form-group">                   <label class="col-md-6  control-label">instruction: </label>               <div class="col-md-6">                                                            <input type="text" class="form-control" name="linstruction" ng-required="true" id="linstruction" ng-model="languageitem.linstruction" required/>               </div>               </div><br/><br/>             <div class="form-group">               <label class="col-md-6  control-label">language category: </label>               <div class="input-group">                 <div class="input-group-btn">                   <select class="pull-right" type="text" name="languagecat" id="languagecat" ng-model="languageitem.languagecat">                     <option value="">---please select---</option>                     <option ng-repeat="item in scplangcat" value="{{item.language_name}}">{{item.language_name}} - {{item.language_description}}</option>                   </select>                 </div>               </div>               </div><br/><br/>           </div><br/><br/>         </div>       </div>    have these kind of codes in controller file.  dynamic form:      //** dynamic funcion adding language form         $scope.languageformdata = {};         $scope.languageformdata.language = [                 { bname: null, pname: null, pnamesub: null, lfeature: null, lingredient: null, linstruction: null, languagecat: null }         ];          $scope.addlanguageitem = function() {                 $scope.languageformdata.language.push({ bname: null, pname: null, pnamesub: null, lfeature: null, lingredient: null, linstruction: null, languagecat: null });         };          $scope.removelanguageitem = function(languageitem) {             //console.log(subscriber);             $scope.languageformdata.language.pop(languageitem);         };

you should have button copy:

html

<div id="web" ng-repeat="languageitem in languageformdata.language">   <button class="btn btn-primary" ng-click="copyorigin(languageitem)">copy</button>   ... rest of code... </div>

you have button in each element. copy in element option copy origin.

js:

$scope.copyorigin = function (item) {   item.bname = $scope.languageitem.bname;   item.pname = $scope.languageitem.pname;   item.pnamesub = $scope.languageitem.pnamesub; };

where item item_i in list of elements.

whit code, basically, value origin form , move item received parameter in function.

you can check plnkr: http://plnkr.co/edit/7ypp10ydsghf3qnwj01j?p=preview

in plnkr.

  • version 1: code.
  • version 2: code copy button.

extra tip:

  • vars & functions should start lowercase , written in camelcase (even in $scope

Comments

Post a Comment

Popular posts from this blog

android - InAppBilling registering BroadcastReceiver in AndroidManifest -

i'm implementing inapp billing in android app. works well, however, i'm trying decouple broadcast receiver activity manifest. suggestion in android's trivialdrive sample: // important: dynamically register broadcast messages updated purchases. // register receiver here instead of <receiver> in manifest // because call getpurchases() @ startup, therefore can ignore // broadcasts sent while app isn't running. // note: registering listener in activity bad idea, done here // because sample. regardless, receiver must registered after // iabhelper setup, before first call getpurchases(). currently there's class extends broadcastreceiver : public class iabbroadcastreceiver extends broadcastreceiver { /** * intent action receiver should filter for. */ public static final string action = "com.android.vending.billing.purchases_updated"; private final iabbroadcastlistener mlistener; public iabbroadcastreceiver(iabbroadcastlistener listener) { m...
Read more

python Tkinter Capturing keyboard events save as one single string -

is possible store keyboard events 1 string? code below stores 1 char , prints it. card reader or bar code reader, contains collection of character/ string not 1 character @ time. goal save char pressed text variable. from tkinter import * root = tk() def key(event): text= event.char text+= event.char print ("pressed", text) def callback(event): frame.focus_set() print ("clicked at", event.x, event.y) frame = frame(root, width=100, height=100) frame.bind("<key>", key) frame.bind("<button-1>", callback) frame.pack() root.mainloop() currently, creating text variable , everytime key() function gets called, , text stores last character typed. you can define text module level variable , , use module level text inside key function - text = '' def key(event): global text text+= event.char print("pressed", text)
Read more

sql server - Why does Linq-to-SQL add unnecessary COUNT()? -

here tables: create table customer ( cid int primary key, name varchar(32) ) create table ord ( oid int primary key, cid int foreign key references customer, address varchar(20) ) here's linq-to-sql statement: var aaa = c in db.customer select new { c, o = c.ord.tolist() }; and here's inexplicable query generated linq-to-sql: select [t0].[cid] [cid], [t0].[name] [name], [t1].[oid] [oid], [t1].[cid] [cid2], [t1].[address] [address], (select count(*) [dbo].[ord] [t2] [t2].[cid] = [t0].[cid]) [value] [dbo].[customer] [t0] left outer join [dbo].[ord] [t1] on [t1].[cid] = [t0].[cid] order [t0].[cid], [t1].[oid] i want understand how rid of count(*) part. it's entirely uncalled for! linq needs count(*) in order determine number of entries returned o = c.ord.tolist() .
Read more