cfgrid自动高度和宽度

Question

我正在尝试让cfgrid的高度和宽度适合页面，而不管屏幕的大小如何。

 <cfform>
  <!-- I have tried: But it can not have percentages. -->
  <cfgrid name="FLines" height="60%" width="60%" format="html" selectmode="EDIT" striperows="Yes" query="PGs" appendkey="No" hrefkey="True">
  <!-- I do not want to tell it a hardcoded way for width and height. -->
  <cfgrid name="FLines" height="600" width="600" format="html" selectmode="EDIT" striperows="Yes" query="PGs" appendkey="No" hrefkey="True">

    <cfgridcolumn name="PRID" display="No">
    <cfgridcolumn name="PROFILE" header="Profile" width="50">
    <cfgridcolumn name="DESCRIPTION" header="Description" width="200">
    <cfgridcolumn name="Qty" header="Prod Cat" width="50">
    <cfgridcolumn name="CARTONWIDTH" header="Carton Width" width="75">
    <cfgridcolumn name="Configuration" header="Config" width="50">
  </cfgrid>

​

有什么建议吗？

Answer 1

来源： CFGrid - Use full document width by Jules

在这里，作者建议在您的成员区主页上，使用javascript来设置cookie。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
function createCookie(name, value, days) {
if (days) {
var date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
var expires = "; expires=" + date.toGMTString();
} else var expires = "";
document.cookie = escape(name) + "=" + escape(value) + expires + "; path=/";
}

function readCookie(name) {
var nameEQ = escape(name) + "=";
var ca = document.cookie.split(‘;’);
for (var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ‘ ‘) c = c.substring(1, c.length);
if (c.indexOf(nameEQ) == 0) return unescape(c.substring(nameEQ.length, c.length));
}
return null;
}

function eraseCookie(name) {
createCookie(name, "", -1);
}

$(document).ready(function(){
createCookie("bodyWidth", $(document).width()-20, 14);
});
</script>
<cfset structDelete(session, ‘bodyWidth’) />

然后他们在Application.cfc的OnRequestStart中使用它(如果你正在使用它，也可以在application.cfm中工作)

<!— GRID WIDTHS —>
<cfif not isDefined("session.bodyWidth")>
<cfif isDefined("cookie.bodyWidth")>
<cfset session.bodyWidth = cookie.bodyWidth>
<cfelse>
<cfset session.bodyWidth = 1067>
</cfif>
</cfif>

您的cfgrid现在可以使用session.bodywidth作为变量。

缺点是它不会动态响应调整大小，但它确实适用于不同的分辨率。

作者使用JQuery，但是纯Javascript可以做JQuery能做的任何事情，而且看起来JQuery在这里使用得非常少，这个解决方案的大部分都是javascript。