@boikom
@boikom
Forum Replies Created
-
AuthorPosts
-
August 24, 2020 at 2:59 pm in reply to: Disable form submit button and change label after click? #100996
admin
KeymasterHi davout,
Could you please look at this example: https://www.htmlelements.com/angular/demos/dropdownlist/reactiveforms/.
The example includes a code which enables or disables a smart-button within an Angular Reactive form depending on conditions.
Best regards,
Peter Stoev
jQWidgets Team
https://www.jqwidgets.com/Keymaster<div>
<div>Below is my source code:</div>
<div></div>
<div>import * as React from ‘react’;</div>
<div>import AppPage from ‘common/layout/appPage’;</div>
<div>import { Grid, Smart } from ‘smart-webcomponents-react/grid’;</div>
<div>const ProjectCategoryPage = () => {</div>
<div> const dataSource = new Smart.DataAdapter({</div>
<div> dataSource: [</div>
<div> {</div>
<div> EmployeeID: 1,</div>
<div> FirstName: ‘Nancy’,</div>
<div> LastName: ‘Davolio’,</div>
<div> ReportsTo: 2,</div>
<div> Country: ‘USA’,</div>
<div> Title: ‘Sales Representative’,</div>
<div> HireDate: ‘1992-05-01 00:00:00’,</div>
<div> BirthDate: ‘1948-12-08 00:00:00’,</div>
<div> City: ‘Seattle’,</div>
<div> Address: ‘507 – 20th Ave. E.Apt. 2A’,</div>
<div> },</div>
<div> ],</div>
<div> keyDataField: ‘EmployeeID’,</div>
<div> parentDataField: ‘ReportsTo’,</div>
<div> id: ‘EmployeeID’,</div>
<div> dataFields: [</div>
<div> ‘EmployeeID: number’,</div>
<div> ‘ReportsTo: number’,</div>
<div> ‘FirstName: string’,</div>
<div> ‘LastName: string’,</div>
<div> ‘Country: string’,</div>
<div> ‘City: string’,</div>
<div> ‘Address: string’,</div>
<div> ‘Title: string’,</div>
<div> ‘HireDate: date’,</div>
<div> ‘BirthDate: date’,</div>
<div> ],</div>
<div> });</div>
<div> const columns = [</div>
<div> {</div>
<div> label: ‘First Name’,</div>
<div> dataField: ‘FirstName’,</div>
<div> width: 200,</div>
<div> },</div>
<div> ];</div>
<div> return (</div>
<div> <AppPage screen=”administration.projectCategory”></div>
<div> <div className=”col-12″></div>
<div> <Grid</div>
<div> id=”grid”</div>
<div> dataSource={dataSource}</div>
<div> columns={columns}</div>
<div> /></div>
<div> </div></div>
<div> </AppPage></div>
<div> );</div>
<div>};</div>
<div>export default ProjectCategoryPage;</div>
</div>KeymasterThis is the screenshot of the grid
KeymasterHello Hristo,
that’s exactly what I need. The 12 hour format ist very untypical here in Germany.
Thank you.
Another great feature would be the minuteInterval from the TimePicker for the DateTimePicker. Just something that I can set the steps of the timepicker to a certain value. Like this demo:
https://www.htmlelements.com/demos/timepicker/settings/
That would make the DateTimePicker really user-friendly.
Best Regards,
GerhardKeymasterok thanks
KeymasterHi yb,
You can create the Form like that: https://www.htmlelements.com/angular/demos/form/template/ by using the same initialization process like in Angular Reactive Forms. Then you might not set the button’s ‘action’ property so your button will not submit the Form.
Another possible solution is to use Angular Reactive Forms directly. Our Angular components are integrated with Angular Reactive Forms and also with the Template Driven Forms so you have options here. An example of such integration is: https://www.htmlelements.com/angular/demos/dropdownlist/reactiveforms/.
Best regards,
Peter Stoev
Smart HTML Elements
https://www.htmlelements.com/KeymasterHi Peter,
The onReady is called when the Menu is rendered and this is bound to the Angular’s lifecycle after the view is initialized i.e it should work.
Another possible solution could be to data bind the Menu to a dataSource by using initialization similar to Angular’s Reactive Forms. We have an example about binding a menu to a data source here: https://www.htmlelements.com/angular/demos/menu/data-source/
Best regards,
Peter Stoev
jQWidgets Team
https://www.jqwidgets.com/KeymasterI wanted to use the button of the library and specify with function to call something likee that:
<smart-form-control align="right" control-type="button" label="Submit" class="primary" (click)="myFunc($event)"></smart-form-control>KeymasterHi davout,
window.Smart.License = “the license key”; is enough for unlocking a npm package. This code line should be placed in app.module.ts in case of Angular, App.jsx after the imports in case of App.jsx or after the imports in case of Javascript.
Best regards,
Peter Stoev
Smart UI Team
https://www.htmlelements.com/KeymasterHi yb,
If you do not define a submit button in your Form, you can manually submit it by calling form.submit();
Hope this helps.
Best regards,
Peter Stoev
Smart HTML Elements
https://www.htmlelements.com/KeymasterHi Mitesh,
No. Such functionality is not implemented or currently planned.
Regards,
Peter
Smart html elements
Htmlelements.comKeymasterSeems like you missed the api docs of our product. For example: https://www.htmlelements.com/docs/calendar-api/#toc-onchange. You may see that every property, method and event is explained in details and with examples about each component.
Best Regards,
Peter Stoev
Smart HTMLElements Team
https://www.htmlelements.com/KeymasterHi davout,
Thank you for the feedback! Our documentation about this type of CSS layout is available here: https://www.htmlelements.com/docs/view-model-binding/.
What kind of documentation type are you looking for?
Regards,
Peter
Smart HTML Elements Team
https://www.htmlelements.com/KeymasterHi davout,
That is CSS based layout and as such it should not be a Custom Element(Tag). It is similar to Bootstrap’s CSS layouts. The source of the demos is within the download package from our website. You can download from the https://www.htmlelements.com/download/ page.
Regards,
Peter
Smart HTML Elements Team
https://www.htmlelements.com/KeymasterHi Mitesh,
Thanks for writing.
The type of selection you are looking for is not supported by our Kanban UI Component. It cannot be simulated with custom code and requires development by our Team. We will consider it for a future version of it.
Best regards,
Peter Stoev
Smart HTML Elements Team
https://www.htmlelements.com/ -
AuthorPosts