基于选择如何移动到 vue js html 中的另一个页面？

Posted 2023-02-23

【中文标题】基于选择如何移动到 vue js html 中的另一个页面？

【英文标题】：Based on selection how can I move to another page in vue js html?

【发布时间】：2018-11-25 20:37:04

【问题描述】：

这是我的 html 代码（第一次尝试）

 <div class="col-md-4" >
    <div class="form-group label-floating">
    <label class="control-label">Select  No</label>
    <select class="form-control" v-model="or" required="">
    <option value="" selected disabled hidden>Choose Type here</option>
    <option v-for="aon in data" v-bind:href="'/recorddetails/'+aon.docId" >aon.orno</option>
    </select>
    </div>
    </div>

因此，根据下拉菜单，如果我选择了一个特定的值，我需要移动到带有其 docId 的记录详细信息页面。

当我尝试这段代码时，它不起作用。

我也尝试了以下代码（第二次尝试）

<div class="col-md-4" >
<div class="form-group label-floating">
<label class="control-label">Select No</label>
<select class="form-control" v-model="or" required="" @change="orCost()">
<option value="" selected disabled hidden>Choose Type here</option>
<option v-for="aon in data" v-bind:href="'/recorddetails/'+aon.docId" >aon.orno</option>
</select>
</div>
</div>

我的vue js代码是

methods:
 orCost: function(e) 
  var vm = this;
  data = ;
  data['or'] = this.or;
  $.ajax(
  url: '/recorddetails/'+this.or,
  data: data,
  type: "GET",
  dataType: 'json',
  success: function(e) 
  if (e.status)
  

  
  else 

  
  
  );
 return false;
 ,
,

问题是我无法重定向到记录详细信息页面。 请帮助我重定向到记录详细信息页面。我能够在 orCost() 中获取 docId 值和所有内容，但它们没有重定向。请帮我重定向

【参考方案1】：

我猜你的尝试太复杂了。试试这个

我已经包含了一个表格，还添加了一个名称。

<form method="post" action="/recorddetails/" name="myform"  class=" form-inline" >
 <div class="col-md-4" >
 <div class="form-group label-floating">
 <label class="control-label">Select Or No</label>
 <select class="form-control" name="no" v-model="or" required="" >
 <option value="" selected disabled hidden>Choose Type here</option>
 <option v-for="aon in data" v-bind:value="aon.docId" >aon.orno</option>
 </select>
 </div>
 </div>
 <button class="btn search-btn" type="submit"><i class="fa fa-search"></i></button>
 </form>