목록으로

여러개의 input을 오브젝트로 만들고 싶습니다. 채택완료

세진컴퓨터랜드

프로필 보기 이 회원 글보기 이 회원의 댓글보기

2년 전 조회 1,955

답변 2

input아 아래처럼 있다고 할 때,

비동기로 db에 저장하려고 하는데,

</p>

<p><input type="text" name="name[]" value="강백호"> <input type="text" name="number[]" value="10">

<input type="text" name="name[]" value="서태웅"> <input type="text" name="number[]" value="11">

<input type="text" name="name[]" value="정대만"> <input type="text" name="number[]" value="14">

<input type="text" name="name[]" value="송태섭"> <input type="text" name="number[]" value="7"></p>

<p>

선수이름 | 번호

이렇게 한꺼번에 저장해서

ajax를 사용하려고 하는데

자바스크립트에서 객체로 어떻게 저장할 수 있을까요?

1줄을 객체로 만들고 배열로 데이터를 넣으면 될거 같은데

각각의 데이터를 자바스크립에서 어덯게 불러오는지 궁금합니다.

#input

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

정렬:

채택된 답변

+20 포인트

배르만

프로필 보기 이 회원 글보기 이 회원의 댓글보기

2년 전

</p>

<p><?php

if (empty($_POST) == false) {

    // print_r($_POST);

    $names = $_POST['name'];

    $numbers = $_POST['number'];

    foreach ($names as $k => $v) {

        $value = $names[$k] . ' | ' . $numbers[$k];

        echo $value . PHP_EOL;

    }

    exit();

}

?></p>

<p><script src="<a href="http://code.jquery.com/jquery-latest.min.js"></script>" target="_blank" rel="noopener noreferrer">http://code.jquery.com/jquery-latest.min.js"></script></a>

<script>

function make_array_data(arrname) {

    var arr = [];

    var els = document.getElementsByName(arrname);

    els.forEach(function (el, idx) {

        arr.push(el.value);

    });</p>

<p>    return arr;

}</p>

<p>function async_senddata() {

    var datas = {};

    datas['name[]'] = make_array_data('name[]');

    datas['number[]'] = make_array_data('number[]');

    

    $.ajax({

        url: location.pathname,

        method: 'POST',

        data: datas

    }).done(function (msg) {

        console.log(msg);

    });

}

</script></p>

<p><ul>

<li><input type="text" name="name[]" value="강백호"> <input type="text" name="number[]" value="10"></li>

<li><input type="text" name="name[]" value="서태웅"> <input type="text" name="number[]" value="11"></li>

<li><input type="text" name="name[]" value="정대만"> <input type="text" name="number[]" value="14"></li>

<li><input type="text" name="name[]" value="송태섭"> <input type="text" name="number[]" value="7"></li>

<li><input type="button" value="btn" onclick="async_senddata()" /></li>

</ul></p>

<p>

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

애드프로

프로필 보기 이 회원 글보기 이 회원의 댓글보기

2년 전

var name = [];

var number = [];</p>

<p>var nameInputs = document.getElementsByName("name[]");

var numberInputs = document.getElementsByName("number[]");</p>

<p>for (var i = 0; i < nameInputs.length; i++) {

  name.push(nameInputs[i].value);

}</p>

<p>for (var j = 0; j < numberInputs.length; j++) {

  number.push(numberInputs[j].value);

}</p>

<p>name = name.join("|");

number = number.join("|");

이렇게 배열에 담고 ajax 비동기 처리하시면됩니다. ajax 예제는 팁게에 널려있으니 그중 원하시는걸 참조하셔서 구현하시면됩니다.

https://sir.kr/g5_tip?sca=&sfl=wr_subject%7C%7Cwr_content&stx=ajax

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인