Question

I'm building a select list within a modal using a PHP loop.

The options display properly,and upon inspecting elements they are showing the appropriate option value (pageID) as well:

<select name="pageToAssign">
     <?php foreach($activePages as $pages):?>
     <option value="<?php echo $pages['id']?>"><?php echo $pages['id']?><?php echo $pages['title']?></option>
     <?php endforeach?>
</select>
<a href="assignPage.php?pageID=<?php echo $pages['id']?>&displayID=<?php echo $_GET['displayID']?>" class="btn btn-primary" role="button"> Assign Page</a>

The issue is that when I click my submit link, it hits my php script and performs the update in my database but it's with the wrong page ID. It always uses the last pageID of the array that builds my options in the select.

How can I possibly use javascript in order to make sure the pageID in my tag changes with each option select?

Answer 1

好的，因此我首先将ID添加到链接中，以便我们可以轻松地定位它。
接下来，出于相同的原因，我在选择中添加了一个ID。
然后我为select创建了一个更改事件处理程序，并向其添加了逻辑，以首先获取现有的href，将pageID替换为新值，然后将其重新设置为链接上的href，从而保持displayID参数。

我删除了php部分，以便可以在可运行的代码段中对其进行测试。

document.getElementById('pageToAssign').addEventListener('change', function() {
  var assignPage = document.getElementById('assignPage');
  var href = assignPage.getAttribute('href');
  
  assignPage.href = href.replace( /pageID=[^&]+/, 'pageID='+ this.value );
});

<select name="pageToAssign" id="pageToAssign">
  <option value="10">10</option>
  <option value="15">15</option>
  <option value="43">43</option>
</select>

<a href="assignPage.php?pageID=0&displayID=67" class="btn btn-primary" id="assignPage" role="button"> Assign Page</a>

使用JavaScript更改<a> tag to use selected option value

1 个答案: