qForms tips

官方教程

http://www.pengoworks.com/qforms/docs/index.htm

 

1 set和get form 中的field的代码

本来obj.fieldName.getValue() 可以用来获取form中某个field的值，

用obj.fieldName.setValue() 可以用来设置form中某个field的值。

如

 

js为：

 

function  testqForm()
... {

alert( wfqForm.texttest.getValue());
alert(wfqForm.selradio.getValue() );

}

上面的代码是从form的field着眼来写的。

现在从form着眼来写。

利用

obj.setFields(object struct, [boolean resetDefault], [boolean resetAll]) 和 obj.getFields() （obj代表的是一个qForm对象） 下面的代码来自qforms官方的例子：

http://www.pengoworks.com/qforms/docs/examples/setfields.htm
（设置了几个fields：Name,Email,EmailUpdates, FavoriteActivities）

function  populate() ... {
76 // create the associative array
77 stcForm = new Object();
78 // populate the array with the form fields as the key,
79 // and the value for the fields as the value
80 stcForm.Name = "Dan G. Switzer, II";
81 stcForm.Email = "dswitzer@pengoworks.com";
82 stcForm.EmailUpdates = "1";
83 // since no values is given, no value will be selected
84 stcForm.FavoriteActivities = "Reading,Music,Sports";
85
86 // populate the form
87 objForm.setFields(stcForm);
88}

读取上面几个fields的value

function showForm()...{
91 // if all you want to do is display the content of the form in an alert
92 // box for debugging information, use the objForm.dump() method instead.
93 // this will do the exact same thing as this function.
94 var str = "";
95 struct = objForm.getFields();
96 for( key in struct ) str += key + " = " + struct[key] + " ";
97 alert(str);
98}

2 在ie和firefox中使用时遇到的一个问题

注意到，对一个名为formName的form
如果使用如下代码来创建qForm对象的话，在firefox中可以使用，而在ie中不行。

formName = new qForm("formName");

据揣测：
ie中无法区别名为formName的form和名为formName的qForm对象，
而在firefox中确可以。

所以，这种写法不规范。
建议；

formNameObj = new qForm("formName");

3 在form中设置required的field。

         < SCRIPT  LANGUAGE ="JavaScript" > ...
<!--//
// initialize the qForm object, specify the layer(document.singleChoice) in which the form resided in
wfqFormObj = new qForm("wfqForm", "document.singleChoice");
wfqFormObj._locked = true;

wfqFormObj.required('field1, field2,field3');

//-->
</ SCRIPT >

4 似乎qForm._locked = true似乎对button类型无用

5 使用innerHTML时遇到的问题

下面的form用另一个form来代替

并且新form也有就form有的input

并且新旧form的名字都一样。

< div >
< form  name ="wfqListForm" >
< input  type ="text"  name ="a"  value ="a" />
                
< SCRIPT  LANGUAGE ="JavaScript" > ...
<!--//
// initialize the qForm object, specify the layer(document.singleChoice) in which the form resided in
wfqListFormObj = new qForm("wfqListForm");
//-->
</ SCRIPT >
</ form >
</ div >

 

用来替换的form

 

< form  name ="wfqListForm" >
< input  type ="text"  name ="a"  value ="a" />
                
< SCRIPT  LANGUAGE ="JavaScript" > ...
<!--//
// initialize the qForm object, specify the layer(document.singleChoice) in which the form resided in
wfqListFormObj = new qForm("wfqListForm");
//-->
</ SCRIPT >
</ form >

替换代码js：

div.innerHTML = .....//新form（上面）的代码

问题是：

新form中虽然有script，但是script并没有被调用。

因此，js代码执行之后dom中wfqListFormObj还是代码原来的form。

但是原form已经不存在，被替换了。所以指向原form的wfqListFormObj中的对象的指向是有问题的。

比如wfqListFormObj中的input还是指向原form中的input，而不是现form中的input。

现form并没有相应的qForms对象。

因此替换js代码要加一行，显示为新form创建qForms对象，如下：

div.innerHTML  =  ..... // 新form（上面）的代码
wfqListFormObj  =   new  qForm( " wfqListForm " );

这样，dom中才有了与现form对应的qForms对象。

 

                                <input type="radio" name="selradio" value="1" >
<input type="radio" name="selradio" value="2" >
            <input type="radio" name="selradio" value="3" >
            <input type="text" name="texttest" value="ddd" >
            <input type="button" onClick="testqForm();" value="testqForm" >