我正在尝试显示一个表单,该表单应该根据编辑按钮中的ID进行填充。因此,我正在采取的程序如下:
- 选择ID为的编辑按钮
- Bootstrap模式框显示
- 在框中显示表单
- 根据ID选择显示记录
在尝试了许多方法(包括创建一个带有表单标记和隐藏输入的按钮)之后,我无法在模态框中显示正确的记录。目前,它显示第一条记录,但不显示我正在用编辑按钮查找的记录。下面的代码。如果有人能帮我弄清楚,请提前感谢。
<cffunction name="GetOrganizationByID" access="public" returntype="query" output="false" hint="gets one organization by its ID.">
<cfargument name="OrgID" type="any" required="true" default="">
<cfset var Org = "" />
<cftry>
<cfquery datasource = "#application.dsn.name#" name="Org">
SELECT org.nID,
org.nSuperOrg,
org.nOrgRefID,
org.cOrgRefID,
org.nActive,
org.cName AS cOrgName,
orginfo.cPhone,
orginfo.cPhoneExt,
orginfo.cFax,
org.nAvailable,
orginfo.cAddress1,
orginfo.cAddress2,
orginfo.cCity,
orginfo.cState,
orginfo.cZip,
orginfo.cCountry,
orginfo.cWebSite
from Organizations org
left join Organization_Info orginfo
on org.nID = orginfo.nOrganizationID
where org.nID = <cfqueryparam cfsqltype="cf_sql_integer" value="#Arguments.orgID#">
</cfquery>
<cfreturn local.Org>
<cfcatch>
按钮:
<td><a href="##" role="button" data-id="#AllOrgs.nid#" id="loadID" class="btn btn-primary btn-sm pull-right" data-toggle="modal" data-target="##edit-org">Edit</a>
JQuery:
<script>
$(document).ready(function() {
$("#loadID").click(function(e) {
var id=$(this).data('id');
e.preventDefault();
var recordata = $(this).attr("href").substring(1); //trim '?' char
$.ajax({
type: "Post",
url: "/pathtoCFC/Organizations.cfc?method=GetOrganizationByID",
data: recordata,
dataType: "html",
success: function(message) {
$("#content").html(message);
}
});
});
});
模式框:
<div id="edit-org" class="modal container hide fade" tabindex="-1">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
×
</button>
<h3>
Edit Organization Info
</h3>
</div>
<div class="modal-body">
<section id="my-account-security-form" class="page container">
<form id="EditOrgForm" class="form-horizontal" action="#cgi.SCRIPT_NAME#?app=edit&view=newOrganization" method="post">
<!--- <div class="container">
<div class="alert alert-block alert-info">
<p>
Enter updated security information for your account as desired. Fields marked with an asterisk are required.
</p>
</div> --->
<div class="row">
<div class="span7">
<fieldset>
<!--- <legend>
Add User Info
</legend> --->
<br>
<div class="control-group ">
<label class="control-label">
Organization Name
<span class="required">
*
</span>
</label>
<div class="controls">
<input name="orgname" class="span4" type="text" value="#AllOrgs.cOrgName#" autocomplete="false">
</div>
</div>
<div class="control-group ">
<label class="control-label">
Address
<span class="required">
*
</span>
</label>
<div class="controls">
<input id="new-pass-verify-control" name="address" class="span4" type="text" value="#AllOrgs.cAddress1#" autocomplete="false">
</div>
</div>
<div class="control-group ">
<label class="control-label">
Address 2
</label>
<div class="controls">
<input name="address2" class="span4" type="text" value="#AllOrgs.cAddress2#" autocomplete="false">
</div>
</div>
<div class="control-group ">
<label class="control-label">
City
<span class="required">
*
</span>
</label>
<div class="controls">
<input name="city" class="span4" type="text" value="#AllOrgs.cCity#" autocomplete="false">
</div>
</div>
<div class="control-group">
<label for="challengeQuestion" class="control-label">
State
<span class="required">
*
</span>
</label>
<div class="controls">
<select id="challenge_question_control" name="state" class="btn-sm">
<option value="#iif(Allstates.RecordCount,DE('#Allstates.stateid#'),de(''))#"
<cfif isDefined('Allstates.stateid')>
selected="true"
</cfif>
>#iif(Allstates.RecordCount,DE('#Allstates.StateName#'),de('---Select State---'))#</option>
<cfloop query="Allstates">
<option value="#stateID#">
#StateName#
</option>
</cfloop>
</select>
</div>
</div>
</fieldset>
</div>
<div id="acct-verify-row" class="span9">
<fieldset>
<div class="control-group ">
<label class="control-label">
Zip Code
<span class="required">
*
</span>
</label>
<div class="controls">
<input name="zipcode" class="input-small" type="text" value="#AllOrgs.cZip#" maxlength="5" autocomplete="false">
</div>
</div>
<div class="control-group">
<label for="challengeQuestion" class="control-label">
Country
<span class="required">
*
</span>
</label>
<div class="controls">
<select id="challenge_question_control" name="Country" class="btn-sm">
<option value="#iif(AllCountries.RecordCount,DE('#AllCountries.countryid#'),de(''))#"
<cfif isDefined('AllCountries.countryid')>
selected="true"
</cfif>
>#iif(AllCountries.RecordCount,DE('#AllCountries.CountryName#'),de('---Select Country---'))#</option>
<cfloop query="AllCountries">
<option value="#CountryCode#">#CountryName#</option>
</cfloop>
</select>
</div>
</div>
<div class="control-group ">
<label class="control-label">
Fax
</label>
<div class="controls">
<input name="fax" class="span4" type="text" value="#AllOrgs.cFax#" autocomplete="false">
</div>
</div>
<div class="control-group ">
<label class="control-label">
Website (URL)
</label>
<div class="controls">
<input name="webUrl" class="span4" type="text" value="#AllOrgs.cWebsite#" maxlength="150" autocomplete="false" placeholder="http://www.yoursite.com">
</div>
</div>
<div class="control-group ">
<label class="control-label">
Phone Number
<span class="required">
*
</span>
</label>
<div class="controls">
<input name="phone" class="span4" type="text" value="#AllOrgs.cPhone#" autocomplete="false">
</div>
</div>
<div class="control-group ">
<label class="control-label">
EXT
</label>
<div class="controls">
<input name="phoneext" class="input-small" type="text" value="#AllOrgs.cPhoneExt#" maxlength="8" autocomplete="false">
</div>
</div>
</fieldset>
</div>
</div>
<footer id="submit-actions" class="form-actions">
<button id="submit-button" type="submit" class="btn btn-primary" name="action" value="CONFIRM">
Save
</button>
<button type="button" data-dismiss="modal" class="btn" value="CANCEL">
Cancel
</button>
</footer>
</div>
</form>
</section>
</div>
<div class="modal-footer">
<!--- <button type="button" data-dismiss="modal" class="btn">
Close
</button> --->
<!--- <button type="button" class="btn btn-primary">
Save changes
</button> --->
</div>
</div>
</div>
对于jquery ajax请求,您应该将data参数设置为一个对象,该对象包含要发布的每个值的属性。
data: { "parameter" : "value" },
将由表单范围(form.parameter)下的.cfm页面拾取并且在作为参数的cfc远程方法调用中(cfc远程参数也可以在querystring中传递)
此代码中的一个问题是没有传递OrgID参数。
尝试更改线路
var recordata = $(this).attr("href").substring(1); //trim '?' char
至
var recordata = { "OrgID" : id };
另一个问题可能是,在cfc函数中,返回本地作用域(local.Org)中的变量,但查询名称在变量(默认)作用域(name="Org")中。如果您运行的是旧版本的CF
<cfset var local = StructNew() />
...
<cfquery datasource = "#application.dsn.name#" name="local.Org">
或者,如果您正在运行更新的(CF 9或更高版本),则不需要创建本地结构