Question

希望有人可以帮助我。

首先总结一下，我有一个项目列表，每个项目都有一个“立即预订”的项目。按钮，一旦点击了书籍按钮，它们就会重定向到各自的页面。我在这之间添加了一个模态弹出窗口。

因此，当新用户访问该网站时，单击其中一个列表项上的“立即预订”按钮，将显示该模式。然后他们输入一些细节并提交提交表格

然后，理想情况下，它们会被重定向到适当的页面。 “立即预订”按钮的项目是通过表达式引擎条目循环生成的，因此链接永远不会被硬编码。

我的问题是模态表单本身的代码不能在条目循环中，因此一旦提交就无法读取要链接的URL，所以我想我必须使用JavaScript来解决这个问题。

我的想法是在“立即预订”按钮中添加数据链接属性，然后在JavaScript中告诉表单，一旦提交，它应该重定向到被点击的链接的data-link属性内的值。

我希望这对某人有意义。这可能吗？有人可能会提供一些建议

由于

编辑：添加代码

<a class="booking-tracker" href="#" data-link="{base_url}ticket/{url_title}">Book now</a>


<div class="modal-wrapper" id="wrapper-modal" style="display:none;">
<form>
  Name: <input type="text" name="name" id="name" value="" />
  Email: <input type="text" name="email" id="email" value="" />
  <input type="hidden" name="redirect" value="redirectvalue here pulled from initial link data-attribute">
  <input type="submit" value="submit" />
</form>
</div><!--modal-->


<script>         
$(document).ready(function() {
$('.booking-tracker').on("click", function (event) {
    if(f24('autoId') == '' && f24('personId') == '') {      
document.getElementById('wrapper-modal').style.display='block';
    } 
    else {
window.location = $(this).data('link');
}
});
});
</script>

因此，如果用户是网站的新用户并且之前没有记录他们的详细信息，则上面的脚本将触发模式，否则它将链接到该链接的默认网址，它只是表单重定向，我正在与

挣扎

Answer 1

使用按钮上的数据生成唯一的网址。单击按钮时，获取此数据并将其添加到表单的隐藏元素。我做了一个小例子。希望它有所帮助！

＆＃13;

var redirect_link = 'www.thisisyourredirectlink.com/';
$('.click-for-modal').on('click' , function(e){
	e.preventDefault(); // Used anchor tags so prevent default
	var redirect_id = $(this).attr('id');
	var new_redirect = redirect_link + redirect_id;
	$('#redirect').removeAttr('value'); //remove if it has been set previously
	$('#redirect').attr('value' , new_redirect); // Add current id
	console.log(new_redirect);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a class="click-for-modal" id="1" href="">Button</a>
<a class="click-for-modal" id="2" href="">Button</a>
<a class="click-for-modal" id="3" href="">Button</a>
<a class="click-for-modal" id="4" href="">Button</a>
<a class="click-for-modal" id="5" href="">Button</a>
<a class="click-for-modal" id="6" href="">Button</a>

<div class="modal-wrapper" id="wrapper-modal" style="">
<form>
  Name: <input type="text" name="name" id="name" value="" />
  Email: <input type="text" name="email" id="email" value="" />
  <input id="redirect" type="hidden" name="redirect" value="redirectvalue here pulled from initial link data-attribute">
  <input type="submit" value="submit" />
</form>
</div><!--modal-->

＆＃13;

需要帮助将数据属性传递到表单重定向

1 个答案: