본문 바로가기

study/Front

formData axios selectbox

<select id="flag">
    <option value="1">선택</option>
</select>

특정 value 값의 선택을 true시킴
$("#flag").val("1").prop("selected", true);

전체 삭제 Just..
$("select#아이디 option").remove();


$('#selectBox option:selected').val();            // select box 선택 값 출력
$('#selectBox option:selected').text();           // option 값 출력


특정 옵션 삭제
$("select#아이디 option[value='option']").remove();


옵션 추가
$("select#아이디").append("<option value='option'>옵션추가</option>");


<input type="checkbox" name="ckall">
<input type="checkbox" name="ck">
<input type="checkbox" name="ck">

$("input[name=ckall]").click(function(){
    if($("input[name=ckall]").prop("checked")){
        $("input[name=ck]").prop("checked",true);   // 전체 체크
    }else{
        $("input[name=ck]").prop("checked",false);  // 전체 체크 해제
    }
});

var chkArray = new Array();

$("input:checkbox[name='delCheck']:checked").each(function(){
    chkArray.push($(this).closest('tr').data('revolutionSeq'));
});

 

인텔리제이 코드정렬

command + option + shift + L 누른후 ok

 

var formData = new FormData(); // Currently empty
formData.append(name, value);
formData.append(name, value, filename);
생성자
FormData()
새로운 FormData 객체를 생성합니다.

메소드
FormData.append()
FormData 객체안에 이미 키가 존재하면 그 키에 새로운 값을 추가하고, 키가 없으면 추가합니다.

FormData.delete()
FormData 객체로부터 키/밸류 쌍을 삭제합니다.

FormData.entries()
이 객체에 담긴 모든 키/밸류 쌍을 순회할 수 있는 iterator를 반환합니다.

FormData.get()
FormData 객체 내의 값들 중 주어진 키와 연관된 첫번째 값을 반환합니다.

FormData.getAll()
FormData 객체 내의 값들 중 주어진 키와 연관된 모든 값이 담긴 배열을 반환합니다.

FormData.has()
FormData 객체에 특정 키가 포함되어 있는지 여부를 나타내는 boolean 을 반환합니다.

FormData.keys()
이 객체에 담긴 모든 키/벨류 쌍들의 모든 키들을 순회 할 수 있는 iterator를 반환합니다.

FormData.set()
FormData 객체 내에 있는 기존 키에 새 값을 설정하거나, 존재하지 않을 경우 키/밸류 쌍을 추가합니다.

FormData.values()
이 객체에 포함된 모든 밸류를 통과하는 iterator를 반환합니다.


let formData = new FormData();

// ... formData.append("키이름", "값"); 생략

for (let key of formData.keys()) {
	console.log(key, ":", formData.get(key));
}

for(let value of formData.values()){
	console.log(value, " : ",formData.get(value));
}

 

<template>
  <div>
    <form v-on:submit.prevent="submitForm"> 
      <div>
        <label for="username">id:</label>
        <input id="username" type="text" v-model="username">
      </div>
      <div>
        <label for="password">pw:</label>
        <input id="password" type="password" v-model="password">
      </div>
      <button type="submit">login</button>
    </form>
  </div>
</template>

<script>
import axios from 'axios'

export default {
  data: function(){
    return {
      username: '',
      password: '',
    }
  },
  methods: {
    submitForm: function() {
      
      console.log(this.username, this.password);
      var url = 'https://jsonplaceholder.typicode.com/users';
      var data = {
        username: this.username,
        password: this.password
      }
      axios.post(url, data)
        .then(function(response){
        console.log(response);
       })
        .catch(function(error){
          console.log(error);
        });
    }
  }
}
</script>

엑시오스(axios)

'study > Front' 카테고리의 다른 글

java script 오늘날짜 입력  (0) 2023.10.25
Javascript typeof. typeof undefined  (0) 2023.10.25
find  (0) 2023.10.24
모르면 손해보는 21가지 JavaScript 축약코딩 기법seokkitdo·2021년 12월 31일  (0) 2023.10.20
axios.js  (0) 2023.10.16