Javascript 选择决定要打开的窗体操作

我有一个以select开头的表单。根据第一次选择（选择哪个报告），我需要更改表单提交给哪个.cfm的操作路径。有人能帮我做这件事吗？我对任何合适的方式都持开放态度，无论是HTML、ColdFusion还是jQuery（Javascript）

所以从选择开始：

<select class="form-control" id="reporttype" name="reporttype"> 
                <option value="" selected="selected">Select Report</option>
                <option id ="checklistreports" value="checklistreports" >Checklist Stats</option>
                <option id ="locationreports" value="locationreports" >Location Stats</option>
            </select>

选择报告
清单统计
位置统计

如果选择了

#checklistreports

，则表单应为

但如果选择了

#locationreports

，则表单应为

在此方面的任何帮助都将不胜感激

---

我试图在CF中执行IF语句，但不幸的是，我被卡住了，没有结果。

您可以使用

.change

处理程序更改表单的

操作属性

$("#reporttype").change(function() {
    if ($(this).val() == "checklistreports") {
        $("form[name=generatereport]").attr("action", "_checklists_queries.cfm");
    } else {
        $("form[name=generaterport]").attr("action", "_location_queries.cfm");
    }
});

您可以使用
.change
处理程序来更改表单的
操作
属性

$("#reporttype").change(function() {
    if ($(this).val() == "checklistreports") {
        $("form[name=generatereport]").attr("action", "_checklists_queries.cfm");
    } else {
        $("form[name=generaterport]").attr("action", "_location_queries.cfm");
    }
});

我建议只在选项的值中指出表单的操作值


$（'#reporttype'）。更改（函数（）{
form_action=$（this.val（）；
$（'form'）.attr（'action'，form_action）；
$（'span'）。文本（表格行动）；
});

选择报告
清单统计
位置统计
这就形成了行动价值观#

我建议只在选项的值中指出表单的操作值


$（'#reporttype'）。更改（函数（）{
form_action=$（this.val（）；
$（'form'）.attr（'action'，form_action）；
$（'span'）。文本（表格行动）；
});

选择报告
清单统计
位置统计
这就形成了行动价值观#

使用ColdFusion，您随时都可以完成这一切。它简单多了。这里有一种方法

formPage
<form action = "action.cfm" method="post">
<select name="pageToInclude">
<option value="locationQueries.cfm">Location</option>
rest of form.

action.cfm
<cfinclude template = "#form.pageToInclude#">

formPage
位置
剩下的部分。
action.cfm
使用ColdFusion，您随时都可以完成这一切。它简单多了。这里有一种方法

formPage
<form action = "action.cfm" method="post">
<select name="pageToInclude">
<option value="locationQueries.cfm">Location</option>
rest of form.

action.cfm
<cfinclude template = "#form.pageToInclude#">

formPage
位置
剩下的部分。
action.cfm
如果表单包含不同的元素，则可以使用css和“选择取消隐藏正确表单”菜单上的onchange处理程序隐藏表单

html:

如果表单包含不同的元素，可以使用css和“选择取消隐藏正确表单”菜单上的onchange处理程序隐藏表单

html:

您已经有了一个公认的答案，但我想为您选择的答案提出一个更简洁的解决方案，以及一个替代方案：

选项#1（内联和干净）：

// Cache the selector for better reuse.
var form = $("form[name=generatereport]");

$("#reporttype").change(function() {
    var action = $(this).val() === 'checklistreports' ? '_checklists_queries.cfm' : '_location_queries.cfm';
    form.attr('action', action);
});

// Cache the selector
var form = $('form[name=generatereport]');

// Now you can define the variable states for your app.
var config = {
    checklistreports: {
      action: '_checklists_queries.cfm'
    },
    locationreports: {
      action: '_location_queries.cfm'
    }
};

// Updating is trivial
$('#reporttype').change(function() {
    var selected = $(this).val();
    form.attr('action', config[selected].action);
});

上面的选项只是您选择的答案的一个更紧凑的版本，但是利用了选择器缓存，这对性能有好处

选项2（“全局”配置选项）：

// Cache the selector for better reuse.
var form = $("form[name=generatereport]");

$("#reporttype").change(function() {
    var action = $(this).val() === 'checklistreports' ? '_checklists_queries.cfm' : '_location_queries.cfm';
    form.attr('action', action);
});

// Cache the selector
var form = $('form[name=generatereport]');

// Now you can define the variable states for your app.
var config = {
    checklistreports: {
      action: '_checklists_queries.cfm'
    },
    locationreports: {
      action: '_location_queries.cfm'
    }
};

// Updating is trivial
$('#reporttype').change(function() {
    var selected = $(this).val();
    form.attr('action', config[selected].action);
});

这个选项很有趣，因为它允许您在一个地方为组件定义所有不同的“状态”，这对可读性和维护很好，并且它使组件的实际更新与查找应该具有的值一样简单
 您已经有了一个可接受的答案，但我想为您选择的答案提出一个更简洁的解决方案，以及一个替代方案：

选项#1（内联和干净）：

// Cache the selector for better reuse.
var form = $("form[name=generatereport]");

$("#reporttype").change(function() {
    var action = $(this).val() === 'checklistreports' ? '_checklists_queries.cfm' : '_location_queries.cfm';
    form.attr('action', action);
});

// Cache the selector
var form = $('form[name=generatereport]');

// Now you can define the variable states for your app.
var config = {
    checklistreports: {
      action: '_checklists_queries.cfm'
    },
    locationreports: {
      action: '_location_queries.cfm'
    }
};

// Updating is trivial
$('#reporttype').change(function() {
    var selected = $(this).val();
    form.attr('action', config[selected].action);
});

上面的选项只是您选择的答案的一个更紧凑的版本，但是利用了选择器缓存，这对性能有好处

选项2（“全局”配置选项）：

// Cache the selector for better reuse.
var form = $("form[name=generatereport]");

$("#reporttype").change(function() {
    var action = $(this).val() === 'checklistreports' ? '_checklists_queries.cfm' : '_location_queries.cfm';
    form.attr('action', action);
});

// Cache the selector
var form = $('form[name=generatereport]');

// Now you can define the variable states for your app.
var config = {
    checklistreports: {
      action: '_checklists_queries.cfm'
    },
    locationreports: {
      action: '_location_queries.cfm'
    }
};

// Updating is trivial
$('#reporttype').change(function() {
    var selected = $(this).val();
    form.attr('action', config[selected].action);
});

这个选项很有趣，因为它允许您在一个地方为组件定义所有不同的“状态”，这对可读性和维护很好，并且它使组件的实际更新与查找应该具有的值一样简单
 我有另一个选择，要求打印pdf或excel。这也是我尝试创建的位置吗？我有另一个选择，要求打印pdf或excel。这是否也是我尝试创建的位置？如果此下拉列表在整个应用程序中只有一个位置关心所选报告，则这是一个很好的解决方案。但是，如果应用程序的其他部分关心此下拉列表选择了一个报表而不是另一个报表，则此解决方案是不可扩展的。如果此下拉列表在整个应用程序中只有一个位置关心所选报表，则这是一个好的解决方案。但是，如果应用程序的其他部分关心此下拉列表选择了一个报表而不是另一个报表，那么此解决方案是不可扩展的。