고수님들 &option= 이것을 지우고싶어요

고수님들 &option= 이것을 지우고싶어요

QA

고수님들 &option= 이것을 지우고싶어요

답변 5

본문

아래 라디오버튼을 누르면 기존 주소 끝에 A, B, C, 주소가 뭍는데 &option= 이것도 따라 붙습니다.

기존주소를 건드리지말고 끝에 A, B, C, 이것만 붙을 수 는 없나요?

 

 
<input type="radio" name="option" value="A" id="optionA" <?php if ($selectedOption === "A") echo "checked"; ?>>
<label for="optionA">A</label>
<input type="radio" name="option" value="B" id="optionB" <?php if ($selectedOption === "B") echo "checked"; ?>>
<label for="optionB">B</label>
<input type="radio" name="option" value="C" id="optionC" <?php if ($selectedOption === "C") echo "checked"; ?>>
<label for="optionC">C</label>
<script>
  const options = document.getElementsByName("option");
  options.forEach(function(option) {
    option.addEventListener("change", function() {
      const selectedValue = this.value;
      if (selectedValue !== "") {
        const baseUrl = window.location.href.split("?")[0];
        const searchParams = new URLSearchParams(window.location.search);
        searchParams.set("option", selectedValue);
        const newUrl = baseUrl + "?" + searchParams.toString();
        window.location.href = newUrl;
      }
    });
  });
</script>

이 질문에 댓글 쓰기 :

답변 5

작업하시는 페이지가 어디인가요?

option.addEventListener("change", 

  change보다는 click이 나아 보입니다.

현재 페이지를 알면

window.location.href를

Php로 지정하고 끝에 A~C만 붙여 줄 수 있습니다.


<input type="radio" name="option" value="A" id="optionA" >
<label for="optionA">A</label>
<input type="radio" name="option" value="B" id="optionB">
<label for="optionB">B</label>
<input type="radio" name="option" value="C" id="optionC">
<label for="optionC">C</label>
<script>
  const options = document.getElementsByName("option");
  options.forEach(function(option) {
    option.addEventListener("change", function() {
      const selectedValue = this.value;
      if (selectedValue !== "") {
        const baseUrl = window.location.href.split("?")[0];
        const searchParams = new URLSearchParams(window.location.search);
        const newUrl = baseUrl + "?" + selectedValue.toString();
        window.location.href = newUrl;
      }
    });
  });
</script>

이렇게 하시면 됩니다.



<input type="radio" name="option" value="A" id="optionA" >
<label for="optionA">A</label>
<input type="radio" name="option" value="B" id="optionB">
<label for="optionB">B</label>
<input type="radio" name="option" value="C" id="optionC">
<label for="optionC">C</label>
<script>
  const options = document.getElementsByName("option");
  options.forEach(function(option) {
    option.addEventListener("change", function() {
      const selectedValue = this.value;
      if (selectedValue !== "") {
        const baseUrl = window.location.href.split("?")[0];
        const searchParams = new URLSearchParams(window.location.search);
        const newUrl = baseUrl + "?" + searchParams.toString()+selectedValue.toString();
        window.location.href = newUrl;
      }
    });
  });
</script>

으로 하시면 됩니다.


<?php
$selectedOption = isset($_REQUEST['stx']) == true ? $_REQUEST['stx'] : '';
?> 
<input type="radio" name="option" value="A" id="optionA" <?php if ($selectedOption === "A") echo "checked"; ?>>
<label for="optionA">A</label>
<input type="radio" name="option" value="B" id="optionB" <?php if ($selectedOption === "B") echo "checked"; ?>>
<label for="optionB">B</label>
<input type="radio" name="option" value="C" id="optionC" <?php if ($selectedOption === "C") echo "checked"; ?>>
<label for="optionC">C</label>
<script>
  const options = document.getElementsByName("option");
  options.forEach(function(option) {
    option.addEventListener("change", function() {
      const selectedValue = this.value;
      if (selectedValue !== "") {
        const baseUrl = window.location.href.split("?")[0];
        const searchParams = new URLSearchParams(window.location.search);
        // searchParams.set("option", selectedValue);
        searchParams.set("stx", selectedValue);
        const newUrl = baseUrl + "?" + searchParams.toString();
        window.location.href = newUrl;
      }
    });
  });
</script>
답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
전체 64
© SIRSOFT
현재 페이지 제일 처음으로