将动态创建的输入值复制到文本区域

时间:2017-08-01 08:56:49

标签: javascript jquery

我有3列的bootstrap行。每列都有输入。我有按钮“添加行”,添加另一行3列。每个输入值都复制到textarea。但我有问题。我只能从第一行复制值。如何从所有输入中复制值?第二个问题,我如何格式化输出

ROW1 数据-1 数据-2- 数据-3

行2 数据-4- 数据-5- 数据-6

import urllib.request
import urllib
import json
import xml.etree.ElementTree as ET
import csv
from bs4 import BeautifulSoup

link = 'https://maharerait.mahaonline.gov.in/searchlist/searchlist'
talukaLink = "https://maharerait.mahaonline.gov.in/SearchList/GetTaluka"
distlink = "https://maharerait.mahaonline.gov.in/SearchList/GetDistrict"
prjLink = "https://maharerait.mahaonline.gov.in/SearchList/GetProjectName"

alldata = []

links = {}
certificatedata = []

def getData(url, values):
    data = urllib.parse.urlencode(values)
    data = data.encode('utf-8')
    req = urllib.request.Request(url, data)
    response=urllib.request.urlopen(req)
    data = response.read()
    data = data.decode("utf-8")
    return data


def getDivsion():
    ## for now we are taking 6 districts.. it needs to updated when the data 
gets updatedd
    return range(1,7)

  def getDistrict(divId):
      global distlink
      values = {'DivID': divId}
      data = getData(distlink, values)
    return data

def parseJson(data):
    parsed = json.loads(data)
    return parsed

def getTaluka(disId):
   global talukaLink
   values= {'DisID': disId}
   data = getData(talukaLink, values)
    return data

def getProjects(divId, disId):
    global prjLink
    values= {'DisID': disId, 'DivID': divId}
    #print(values)
    data = getData( prjLink, values)
    if len(data)<10:
    return "{}"
return data

def getProjectsList():
    divList = getDivsion()
    flag = 0
    for divId in divList:
        disData = getDistrict(divId)
        disList = parseJson(disData)
        for disObj in disList:
            disId = disObj["ID"]
            prjData = getProjects(divId, disId)
        #print(" >>>> "+str(disId)+" >> "+str(divId))
        #print(prjData)
        prjJson = parseJson(prjData)
        for prjObj in prjJson:
            flag += 1
            prjId = prjObj["ID"]
            values = {'ID':0, 'pageTraverse': 1, 'Division': divId,     'hdnDistrict': '', 'hdnProject':'', 'District': disId, 'Taluka':'', 'Village': '', 'Project': prjId, 'CertiNo':'', 'btnSearch':'Search'}
            finalPrjData = getData(link, values)
            parseXMLData(finalPrjData)
            #if len(alldata)>100:
            #    break

def parseXMLData(htmldata):
    global alldata, links
    soup = BeautifulSoup(htmldata, "html.parser")
    tables = soup.find_all("table")
    for table in tables:
        print(len(alldata))
    attr = table.attrs
    if "table" in attr['class']:
        tbody = table.find_all("tbody")
        if len(tbody)>0:
            tbody = tbody[0]
            tr_lst = tbody.find_all("tr")
            for tr in tr_lst:
                sublist = []
                td_lst = tr.find_all("td")
                if len(td_lst)>6:
                    prjname = td_lst[1].text
                    proname = td_lst[2].text
                    certNo = td_lst[3].text
                    sublist.append(prjname)
                    sublist.append(proname)
                    sublist.append(certNo)
                    td = td_lst[4]
                    a_lst = td.find_all("a")
                    if len(a_lst)>0:
                        a = a_lst[0]
                        href = a.attrs['href']
                        link = "https://maharerait.mahaonline.gov.in/"+href
                        links[certNo] = link
                        sublist.append(link)
                if len(sublist)>0:
                    alldata.append(sublist)
return alldata


def writedata(alldata1, filename):
    print(" >>>> FINAL PRINTING DATA >>>> ")
    #import pdb; pdb.set_trace()
    with open("./"+filename,'w') as csvfile:
        csvfile = csv.writer(csvfile, delimiter=',')
        #csvfile.writerow(titleRow)
        csvfile.writerow("")
        for i in range(0, len( alldata1 )):
            #print(alldata1[i])
            csvfile.writerow( alldata1[i]  )


def processlinksforcert():
    global links, certificatedata
    print(">> Came in fetching certificates data >>> " )
    for certno in links.keys():
        link = links[certno]
        htmldata = getData(link, {})
        soup = BeautifulSoup(htmldata, "html.parser") 
        divs = soup.find_all("div")
        for div in divs:
            attr = div.attrs
        if "id" in attr.keys() and "DivProfessional" in attr['id']:
            table = div.find_all("table")
            if len(table)<=0:
                continue
            t_attr = table[0].attrs
            if "table" in t_attr["class"]:
                print(len(certificatedata))
                table = table[0]
                tr_lst = table.find_all("tr")
                index = 1
                while index<len(tr_lst):
                    #import pdb; pdb.set_trace()
                    #for tr in tr_lst:
                    #if index==0:
                    #    continue
                    tr = tr_lst[index]
                    index += 1
                    sublist = []
                    td_lst = tr.find_all("td")
                    if len(td_lst)>2:
                        sublist.append(certno)
                        pername = formattext( td_lst[0].text)
                        cerno = formattext( td_lst[1].text )
                        proftype = formattext( td_lst[2].text )
                        sublist.append(pername)
                        sublist.append(cerno)
                        sublist.append(proftype)
                        certificatedata.append(sublist)
return certificatedata

def formattext(text):
    while text.find("\r\n")>=0:
        text = text.replace("\r\n","")

while text.find("   ")>=0:
    text = text.replace("   ","")
return text

def main():
    global alldata, certificatedata
    #data = getData(url, {})
    getProjectsList()
    print("Before write the projects data to the file. Count >> 
"+str(len(alldata)))
    writedata(alldata, "data.csv")
    data = processlinksforcert()
    print("Before write the certificates data to the file. Count >> 
"+str(len(data)))
    writedata( data, "certificates.csv" )


main()

2 个答案:

答案 0 :(得分:2)

这是你在找什么?

否使新添加的输入也触发我们的keyup,将$("input").on('keyup', function() {更改为$(document).on('keyup', "input", function() {

$('#add').click(function() {
  $('.row.inputs:last').clone().insertAfter(".row.inputs:last");
  $('.row.inputs:last input').val("")
  console.log($(".row.inputs").length)
  if ($(".row.inputs").length == 2){
  $('.row.inputs:last .col-sm-4:last').css("float","left").after('<div><button style="margin-left: 20px" class="removeRow">remove row</button></div>')
  } 
    
});
$(document).on('keyup', "input", function() {
  updateTextarea()
});

$(document).on('click', ".removeText", function() {
  $(this).prev("input").val("")
  updateTextarea()
});

$(document).on('click', ".removeRow", function() {
  $(this).closest(".row").remove()
  updateTextarea()
});

function updateTextarea() {
  var values = "";
  $(".row.inputs").each(function(i) {
    values += "row" + (i + 1) + ": "
    $(this).find("input").each(function(x, e) {
      $(this).next("button").css("display", this.value.length > 0 ? "initial": "none")
      var text = $(this).prev("label").text();
      values += this.value + " " + text;
    })

    values += "\n"
  });
  $("textarea").val(values);
}
textarea {
  height: 200px;
  width: 400px;
}

.removeText{display:none;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container">
  <div class="row inputs">
    <div class="col-sm-4">
      <input type="text" name="szerokosc" class="entry" id="szerokosc_1" value="" /><button class="removeText">remove text</button>
    </div>
    <div class="col-sm-4">
      <input type="text" name="wysokosc" class="entry" id="wysokosc_1" value="" /><button class="removeText">remove text</button>
    </div>
    <div class="col-sm-4">
      <input type="text" name="dlugosc" class="entry" id="dlugosc_1" value="" /><button class="removeText">remove text</button>
    </div>
  </div>
  <div class="row">
    <div class="col-sm-12">
      <button id="add">add row</button>
    </div>
  </div>

  <textarea row="10"></textarea>

答案 1 :(得分:1)

您必须对动态添加的元素使用事件委派

您应该使用.on()方法绑定点击事件处理程序。

  

事件委托允许我们将单个事件监听器附加到   父元素,将为匹配a的所有后代触发   选择器,无论这些后代现在存在还是被添加到   将来

详细了解活动委派here.

$('#add').click(function(){
  var anotherRow=$('.row.inputs:eq(0)').clone();
  anotherRow.append('<div class="col-sm-3"><button class="removeText">remove text</button></div>');
  anotherRow.find('input').each(function(){
    $(this).val('');
  });
  anotherRow.insertAfter(".row.inputs:last");
});
$(document).on('keyup',"input",function() {
    var values = "";
    $("input:text").each(function(i) {
        var text=$(this).prev("label").text();
        values +=  (i%3 ==0 ? "\n row"+(i/3)+" " :"") + this.value+ " "+text;
    });
    $("textarea").val(values);
});
$(document).on('click',".removeText",function() {
    $(this).closest('.inputs').remove();
    var values = "";
    $("input:text").each(function(i) {
        var text=$(this).prev("label").text();
        values +=  (i%3 ==0 ? "\n row"+(i/3)+" " :"") + this.value+ " "+text;
    });
    $("textarea").val(values);
});
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container">
<div class="row inputs">
    <div class="col-sm-3">
        <input type="text" name="szerokosc" class="entry" id="szerokosc_1" value="" />
    </div>
    <div class="col-sm-3">
        <input type="text" name="wysokosc" class="entry" id="wysokosc_1" value="" />
    </div>
    <div class="col-sm-3">
        <input type="text" name="dlugosc" class="entry" id="dlugosc_1" value="" />
    </div>
</div>
<div class="row">
    <div class="col-sm-12">
        <button id="add">add row</button>
    </div>
</div>
</div>
<textarea class="box" name="result" rows="5"> </textarea>

相关问题