Anyone have experience with using jQuery datatables with ColdFusion? Did you have any success in using the "serverSide" mode, in getting CF to properly parse the parameters sent by datatables to the server into complex variables? For example, currently if I dump the "form" I'm getting keys like columns[1][data] or search[value]. How do I get ColdFusion to parse these parameters into variables like form.columns[1].data or form.search.value?
According to the documentation at https://datatables.net/manual/server-side, it says:
In most modern server-side scripting environments this data will automatically be available to you as an array.
I'm using ColdFusion 11.
You might want to check out a utility called FormUtils.
It can take this
<h2 class="is-size-2">employee[1]</h2>
<input name="employee[1].name" type="text" value=""><br />
<input name="employee[1].phone" type="text" value=""><br />
<input name="employee[1].permission.2" type="text" value=""><br />
<input name="employee[1].permission.1" type="text" value=""><br />
<input name="employee[1].mode[2]" type="text" value=""><br />
<input name="employee[1].mode[1]" type="text" value=""><br />
And turn it into structs and arrays
<cfset util = new formutils.FormUtils().init() />
<!--- form has been patched --->
<cfdump var="#form#">
It basically allows forms to be pushed over as structs and arrays
Disclaimer
I rewrote the original. The original was done by Brian Kotek.
The links below are to my version of the code. There are also links to his version.
Video demo of it in action: https://coldfusion.adobe.com/2018/10/make-form-processing-simpler-with-brian-koteks-formutils/
Core file: https://github.com/jmohler1970/FormUtils
Demo site: https://github.com/jmohler1970/FormUtils_demo
Related
I am using ant design form in my reactJS application and I'd like to remove the scientific notation from my Input component?
Attaching the sample code
<Input type="number" step="0.00000001" />
Output
This is kind of a dumb solution, but it works: just read the value out of the field and write it back in again in the format you want.
<input type="number" step="0.00000001" onchange="this.value=parseFloat(this.value).toFixed(8);" />
I'm using Scala-Play with the Play-Bootstrap extension and AngularJS. Since the controlling of the application is managed by AngularJS I need the form to be submitted and the response managed by AngularJS and not by the Play controller.
As I understand and using pure AngularJS one can use ng-model to link each input to a specific $scope nested variable e.g.
<form name="userForm">
<label>
Name:
<input type="text" name="userName"
ng-model="user.name"/>
</label><br />
<label>
Other data:
<input type="text" ng-model="user.data" />
</label><br />
</form>
is it possible to accomplish the same by using ng-model on the form tag? instead of applying it to each input? the problem is that it is not possible injecting the needed ng-model to each input while using Play-Bootstrap i.e. this doesn't work:
#b3.text(computeInSampleForm("impliedVolSpread"), '_label -> messagesApi("myapp.impliedVolSpread"),
'_showConstraints -> false, 'ng-model -> "impliedVolSpread")
it fails with error value - is not a member of Symbol it would work if I only knew how to escape the - dash character.
Since I already created a customized version of the b3.form as b3.bgform it would be great if I could do bg-model at the form level ... is that possible?
You can fix this error by explicitly converting to a Symbol:
Symbol("ng-model") -> "impliedVolSpread"
Or by using an implicit conversion import:
#import views.html.helper.Implicits._
This article about when to use directives, services and controllers, as awesome and helpful as it is... has me massively confused about everything I think I know about the ideal structure of an angular application and I just need a sanity check:
If you have two inputs:
<label><span>false</span>
<input type='radio' value='false' ng-value='false' ng-model='thing.exists' />
</label>
<label><span>true</span>
<input type='radio' value='true' ng-value='true' ng-model='thing.exists' />
</label>
that are part of a larger form, which will in turn submit to pull in another form... and that information will later be shown for review, is this the correct way to architect that:
TLDR: Flow of execution:
ng-model="thing.exist" ==> thing ==> ThingController ==> a service ==> ...details... ==> getDetails?
Right now I have:
<div ng-controller='ThingController as thing'>
<fieldset>
<label><span>Doesn't exist</span>
<input type='radio' value='false' name='checkExist'
ng-value='false' ng-model='thing.exists' />
</label>
<label><span>Does exist</span>
<input type='radio' value='true' name='checkExist'
ng-value='true' ng-model='thing.exists' />
</label>
</fieldset>
<!-- ... -->
</div>
When the input changes,
I should use ng-change on the inputs to trigger the behavior (like the addition of a directive)... right (via a controller)?
I should use then controller to add the result of the ng-change to a service? Like... passing the model value (thing.exists) to a service so I can use that value later?
As a complication factor- this application uses Require.js to manage dependencies.
(Actually, the article itself isn't the source of my confusion- it's the comments on the article that are killing me.)
That's pretty much it, you've got it right. The idea is the following:
Use directives for managing user interface interactions and -some- state changes
Use controllers for managing a shallow set of logic
Use services for sharing data, functionality and business logic.
Aka, just like on your server - try not to load too much into a controller.
I was working on a simple angular functionality. but got stuck.
e.g.
<input type="radio" data-ng-model="package" value="1" data-more="some text here" />
Is there a way to retrieve the more data?
I know I can get the value by this using this: {{package}}
Cheers
My C# web method uses JavaScriptSerializer to return a JSON object in string format called jSONstring. My javascript then uses jquery.deserialize and does the following:
$("#form").deserialize(JSON.parse(jSONstring));
This seems to work fine except when mapping to an array of elements.
My HTML is as follows:
<input name="AccountID" value="" />
<input name="Account[0].name" value="" />
<input name="Account[1].name" value="" />
<input name="Account[2].name" value="" />
The JSON object returned from the server looks like:
'{"AccountID": 123, "Account":[{"name": "AccountName1"},{"name": "AccountName2"},{"name": "AccountName3"}]}'
After calling deserialize the AccountID is updated but the account names are never updated to AccountName1, AccountName2, AccountName3.
I tried renaming my input elements to the following and it still doesn't work:
<input name="Account.name" value="" />
<input name="Account.name" value="" />
<input name="Account.name" value="" />
What am I doing wrong?
That format is not supported by the plugin, it only supports data generated from jQuery.serialize, jQuery.serializeArray and jQuery.serializeObject (unofficial). That said, it would not be hard to write a small function that would convert the returned JSON object you have into one of the formats listed above. Another option would be using a different method of serialization, such as parametizing it.