Elm Html and view : Model -> Html Msg - html

I'm brand new to Elm and I'm struggling to see what is wrong here..
view : Model -> Html Msg
view model = div [] [ button [ onClick NewStrategy ] [ text "-" ] ]
complains that..
The type annotation for `view` says it always returns:
Html (Msg)
But the returned value (shown above) is a:
Html (String -> Msg)
It looks no different to http://elm-lang.org/examples/buttons to me. One div with a button inside with an onClick and some text.
What am I missing here?

You hadn't listed the source code for Msg but the error you've listed seems to indicate that the NewStrategy constructor takes a single string parameter. If you gave it a string value, it should work.
Example:
view model = div [] [ button [ onClick (NewStrategy "submit") ] [ text "submit" ] ]

Related

Error while using filter in flutter for Listview

I am trying to filter the list with element data_code which is received by a Stateful widget, but I am getting the error as below description
Code
List list4= list2.where(widget.bomdatareceived[0]['data_items'][0]['data_code'].contains(widget.data_code));
ERROR
type 'bool' is not a subtype of type '(dynamic) => bool'
JSON Data
"data_items": [
{
"data_code": "61",
"data_name": "dat1",
"data_item": "327",
},
{
"data_code": "61",
"data_name": "dat4",
"data_item": "390",
},
{
"data_code": "65",
"data_name": "dat3",
"data_item": "1056",
}
]
The above JSON data is on the list, I want to implement a filter kind of thing in this ListView.builder, to enlist only those elements which have same data_code, I am not implementing any search bar kind of thing on the screen. I am receiving the value of data_code from the previous screen and want to build the list which has the same data_code .
Please guide me how to resolve this issue. I am new at the learning of flutter
In where method you need to use function which returns bool and its argument is each element of a list. So in your situation it should be something similar to:
var list4 = list2.where((item) => item.contains(widget.data_code));
I don't know how list2 looks like, so it's sample condition.

Using Laravel, is there a way to run validation on one ajax call with data for multiple models?

Assuming one were to post multiple data sets of one model at the time through JSON, it is possible to insert these using Eloquent's Model::create() function. However in my case I'll also need to validate this data.
The Validator only takes a Request object as input, and as far as I've seen I can't create a new Request instance with only one model.
Assuming this would be the input data (JSON), and index is the value for the browser to know what data belongs to an what item (as they have no unique ID assigned at the point of creation)
[
{
"index" : 1,
"name" : "Item 1",
"value" : "Some description"
},
{
"index" : 2,
"name" : "Item 2",
"value" : "Something to describe item 2"
},
(and so on)
]
Every object in the root array needs to be ran through the same validator. The rules of it are defined in Model::$rules (public static array).
Would there be a way to run the validator against every item, and possibly capture the errors per item?
You can utilize Validator for manual validation:
...
use Validator;
...
$validator = Validator::make(
json_decode($data, true), // where $data contains your JSON data string
[
// List your rules here using wildcard syntax.
'*.index' => 'required|integer',
'*.name' => 'required|min:2',
...
],
[
// Array of messages for validation errors.
...
],
[
// Array of attribute titles for validation errors.
...
]
);
if ($validator->fails()) {
// Validation failed.
// $validator->errors() will return MessageBag with what went wrong.
...
}
You can read more about validating arrays here.

Dynamically create and submit a form

I have some data in my model which I want to put into a request body and send it with a POST request. The problem is I want the browser to navigate to the request URL because the route returns a new HTML page. Normally this would be done by putting the data in a form and then using JS to submit it.
How can I do this with Elm?
Edit - Updated based on your comment clarification
As I understand your question, you want to be able to construct a POST request behind the scenes but let the browser post it so that the browser is redirected to the actual page it is posted, leaving your Elm app behind.
You could build up the form in Elm but keep it hidden, then when you want to trigger it, pass the form ID to a port which performs the form submission.
type alias Model =
{ foo : String }
view model =
div []
[ Html.form
[ id "my-form"
, action "https://requestb.in/1crya751"
, method "POST"
, style [ ( "display", "none" ) ]
]
[ input [ type_ "text", name "foo", value model.foo ] []
]
, div []
[ button [ onClick SubmitForm ] [ text "Submit" ] ]
]
type Msg
= SubmitForm
update msg model =
case msg of
SubmitForm ->
model ! [ submitForm "my-form" ]
port submitForm : String -> Cmd msg
Your javascript could look something like this (albeit with some error handling in case the id doesn't exist):
var app = Elm.Main.fullscreen()
app.ports.submitForm.subscribe(function(formId) {
document.getElementById(formId).submit();
});
Here is a working example of this on ellie-app.com. It posts the form to requestb.in so you can see what has been posted by going here.
The reason I'm recommending a hidden form instead of trying to use the standard Http packages is because it sounds like you want the browser to be redirected to whatever form you are posting to. You couldn't really achieve the same thing by using the Http packages.

HTML indexing into JSON variable for NgModel

In all the component classes of each of page of my Angular 2 form, I'm calling an API for retrieval of saved input values to be stored in a global variable in JSON format inside of a global service, if this global variable has not been filled in yet.
After retrieval and initializing the global variable with the JSON data from the API, I'd like to establish 2-way data binding using NgModel on each of my HTML pages with the corresponding values inside this global variable. However, I'm having trouble indexing properly into this global variable containing my JSON data. I'd like to bind my input value directly to the global variable, because upon saving of the form, I can simply call one service that would send this one global variable in the body of a POST call.
JSON Data stored in globalVariable:
How do I retrieve "value a", "value b", "value c" in the HTML?
{
"data": [
{
"field 1" : "value 1",
"page1" : {
"field a" : "value a"
"field b" : "value b"
},
"page2" : {
"field c" : "value c"
}
}
]
}
page1.component.ts:
constructor(..., public globalService: GlobalService:, #Inject(GlobalVariable) private globalVariable: any, ...) {}
ngOnInit() {
if (Object.keys(this.globalService.globalVariable).length < 1) {
this.globalService.getAPI().subscribe(
data => this.globalService.globalVariable = data['data'],
err => console.error(err),
() => {
console.log(this.globalService.globalVariable[0]['page1']['field a']); //Prints 'value a' correctly!
//In HTML:NgModel: I can't index globalVariable[0]['page1']['field a']
//this._privateVariable = this.globalService.globalVariable;
//In HTML:NgModel: I can't index _privateVariable[0]['page1']['field a']
//this._privateVariable = this.saveInformation.information[0]['page1'];
//In HTML:NgModel: I can index _privateVariable['field a'] for ['value a'], but //I don't want to manage many _privateVariables, each storing each page's input
//values to be sent in POST request in save.
}
)
}
}
page1.component.html:
...
<div>
<input type="text" [(ngModel)]="globalVariable[0]['page1']['field a']">
</div>
...
The above line outputs the following error to console:
angular2.dev.js:25644 ORIGINAL EXCEPTION: TypeError: Cannot read property '0' of undefined
There are mistake in your code while fetching data and using in the view (HTML). you have to use code like this :-
<input type="text" [(ngModel)]="globalVariable.data[0].page1['field a']">
also
PS: There is space between your name of key i.e field a so to access the value of JSON object key having space you have to use bracket notation of javascript.
see here working demo of your use case
Working Example
see also
https://medium.com/#prufrock123/js-dot-notation-vs-bracket-notation-797c4e34f01d#.ytvne8m86

Create dynamic controls from JSON Response SAP UI5

I have a requirement to create a group of checkbox with lebels in a page from JSON response.
The JSON response is
{
"data": [
{
"CodeStatus": "Red"
},
{
"CodeStatus": "Orange"
},
{
"CodeStatus": "Green"
},
{
"CodeStatus": "Yellow"
}
]
}
the design is:
the box is vertically scrollable, as it can have more color codes.
Can anyone suggest how to design the above?
If one can provide the implemantation code, that would be very good as I have very time to implement it.
Create a JsonModel . use the setData() method to define its data from the json you got on the response.
Then use a VerticalLayout element and bind its content to "/data" on the model.
This will create a "line" for each element on the data attribute of your model.
Use a template for the line that is a label+checkbox where the label text is bound to "CodeStatus".
You also need a checked attribute on each entry to store the checked attribute of the checkbox.