javascript - 如何在 Laravel 中通过 URL 在 href 标签上执行 javascript 函数

Question

实际场景:

1. 用户点击“Jana Laporan”按钮，(以防输入字段留空)
2. javascript 函数执行，但它返回到另一个 View 。

应该是，一旦用户点击了输入字段为空的按钮，javascript 函数将保持相同的 View 。

这是我的 Javascript 函数:

function validateInput() {
 var strStartDate = document.ReportSearchForm.StartDate.value;
 var strEndDate = document.ReportSearchForm.EndDate.value;
 var strDptId = document.ReportSearchForm.searchDptId.value;

  if (strStartDate == "" && strEndDate == "") {
     alert("Tarikh (Mula) dan Tarikh (Akhir) dikehendaki.");
     document.ReportSearchForm.strStartDate.focus();
     return false;
  }
  else if ((strStartDate != "" && strEndDate == "") || (strStartDate == "" && strEndDate != "")) {
      alert("Tarikh (Mula) atau Tarikh (Akhir) dikehendaki.");
      return false;
  }
  else if (strDptId == "") {
      alert("Jawatankuasa dikehendaki.");
      return false;
  } }

这里是我的表单按钮:

<a id="transboxShow" class="fancybox" data-fancybox-type="iframe" href="{{ URL::to('laporanjumlahmesyuaratresult/sujk?t=2')}}">{{ Form::button('Jana Laporan', array('name'=>'btnAdd', 'onclick'=>'return validateInput(); return false;','class'=>'NormalTextCenter', 'data-fancybox-type'=>'iframe') ) }}</a>

我如何通过 fancybox 弹出窗口执行 javascript 函数以验证我在同一 VIEW 中的输入字段而不转到下一个 url/VIEW？

Answer 1

您的按钮在 <a> 中这就是为什么当你点击按钮时，它会转到你在 href 属性上提供的 url。您可以在超链接的 onclick 属性上移动验证。

<a id="transboxShow" class="fancybox" data-fancybox-type="iframe" href="{{ URL::to('laporanjumlahmesyuaratresult/sujk?t=2')}}" onclick="return validateInput();" >
    {{ Form::button('Jana Laporan', array('name'=>'btnAdd', 'class'=>'NormalTextCenter', 'data-fancybox-type'=>'iframe') ) }}
</a>

或者您可以完全删除该按钮。我不确定为什么 <a> 中有一个按钮标签。