DelphiFan Magazine

Top Menu

Main Menu

  • DELPHI
  • CODE SAMPLES
  • FIREMONKEY
  • DATABASE
  • RELEASES
  • VIDEOS
  • REVIEW
  • TECH NEWS

logo

DelphiFan Magazine

  • DELPHI
  • CODE SAMPLES
  • FIREMONKEY
  • DATABASE
  • RELEASES
  • VIDEOS
  • REVIEW
  • TECH NEWS
  • How to add a server application written in UNIGUI to startup?

  • UniGUI Expiry Link Anonymizer

  • UniGUI Add CAPTCHA to the WEB project

  • UniGui. Unique hybrid of Delphi and JS

  • How to transform a blob field into string lines (varchar) in SQL Firebird?

CODE SAMPLESDELPHI
Home›CODE SAMPLES›UniGui. Unique hybrid of Delphi and JS

UniGui. Unique hybrid of Delphi and JS

By admin
January 26, 2021
597
0
Share:

Today I stumbled upon an interesting feature in UniGui – to handle component events using JavaScript, and specifically using functions from the ExtJS library. Let’s look at a simple example. Let’s open the UniGui project in Delphi and add 2 UniButton1 and UniEdit1 elements to the form

Now, in the object inspector, find ExtEvents

Next, click 2 times on the empty field next to the click event, and the system itself will give us the code

function click(sender, e, eOpts)
{
}
Further, it remains for us only to supplement it
function click(sender, e, eOpts)
{
MainForm.UniEdit1.setValue(‘myValue’);
}
And that’s the most interesting thing !!! Pay attention to the design
 MainForm.UniEdit1.setValue(‘myValue’);
After all, its first part, MainForm.UniEdit1, is like pure Delphi code, but its last part setValue (‘myValue’) is a method from the ExtJS library for the Ext.form.field.Text component, but what kind of component is this? This is Delphi Uniedit1. Generally speaking, all this code is in javascript, but for the convenience of dolphins, the names of the elements, the structure are selected in such a way as to best correspond to the Delphi spirit.

Thus, how to access a particular element through JS from Delphi?

Select the element on which we will work (for example, the UniButton1 button in our example)

Open Object Inspector in Delphi

Find ClientEvents, then ExtEvents

Next, select the event that we will process, for example click, then click 2 times on the empty field next to it – a function template will appear, for example, for the click event

function click(sender, e, eOpts)
{
}
Further, if we, for example, want to process UniEdit1, then close ExtEvents for the button and open it for UniEdit.
Now let’s see what kind of element we have according to the classification of the ExtJS library, you can see it in the upper left corner
Further, you can get into the library API for this element and select one or another property or method, depending on the task.
Next, let’s return to ExtEvents for the button and write, for example, such a handler
function click(sender, e, eOpts)
{
MainForm.UniEdit1.setValue(‘myValue’);
}
The entire chain before the method / property declaration is written as in Delphi MainForm.UniEdit1, the second part .setValue (‘myValue’) is written as in the JS library API. Generally speaking, this whole construct is JS, or rather its ExtJS framework, so it is important that case is respected. Since Delphi is a case-insensitive language, it is easy to make mistakes.
!!!!!! Important note. JS is a case sensitive language, so it is important that the case matches what is written in Delphi. I.e,
Right
MainForm.UniEdit1.setValue (‘myValue’); // <<<< Exactly the same as what is written in Delphi
Wrong
mainform.UniEdit1.setValue (‘myValue’); // <<< Register error
Mainform.uniEdit1.setValue (‘myValue’); // <<< Register error
Tagsdelphigridjsunigui
Previous Article

How to transform a blob field into ...

Next Article

UniGUI Add CAPTCHA to the WEB project

0
Shares
  • 0
  • +
  • 0
  • 0
  • 0
  • 0

admin

Related articles More from author

  • DELPHIREVIEW

    Ultimate Robust SecureBridge SSH

    September 29, 2020
    By admin
  • DELPHIFIREMONKEY

    Delphi Android APP Automatic Update

    October 31, 2020
    By admin
  • DELPHITECH NEWS

    Python for Delphi Developers – Part 1 and 2

    September 30, 2020
    By admin
  • CODE SAMPLESDELPHIFIREMONKEY

    Delphi implementation software version verification code

    December 10, 2020
    By admin
  • CODE SAMPLESDELPHI

    Two ways to improve the efficiency of unigui development

    October 13, 2020
    By admin
  • CODE SAMPLESDELPHIFIREMONKEY

    Show image in Firemonkey TListBox

    December 15, 2020
    By admin

Leave a reply Cancel reply

You may interested

  • CODE SAMPLESDELPHI

    How does Delphi handle different types of files

  • DELPHIRELEASES

    SVGICONIMAGELIST 2.2: New SVG engine “CAIRO”

  • CODE SAMPLESDELPHI

    Delphi calculates MD5

  • LATEST REVIEWS

  • TOP REVIEWS

Timeline

  • January 27, 2021

    How to add a server application written in UNIGUI to startup?

  • January 27, 2021

    UniGUI Expiry Link Anonymizer

  • January 26, 2021

    UniGUI Add CAPTCHA to the WEB project

  • January 26, 2021

    UniGui. Unique hybrid of Delphi and JS

  • January 13, 2021

    How to transform a blob field into string lines (varchar) in SQL Firebird?

Latest Comments

Find us on Facebook

Follow Us on Instagram

logo

Our website, law, laws, copyright and aims to be respectful of individual rights. Our site, as defined in the law of 5651 serves as a provider of space. According to the law, contrary to the law of site management has no obligation to monitor content. Therefore, our site has adopted the principle of fit and remove. Works are subject to copyright laws and is shared in a manner that violated their legal rights, or professional associations, rights holders who, adsdelphi@gmail.com I can reach us at e-mail address. Complaints considered to be infringing on the examination of the content will be removed from our site.

About us

  • 660 Pennsylvania Avenue Southeast #100 Washington, DC 20003
  • 0123456789
  • adsdelphi@gmail.com
  • Recent

  • Popular

  • Comments

  • How to add a server application written in UNIGUI to startup?

    By admin
    January 27, 2021
  • UniGUI Expiry Link Anonymizer

    By admin
    January 27, 2021
  • UniGUI Add CAPTCHA to the WEB project

    By admin
    January 26, 2021
  • UniGui. Unique hybrid of Delphi and JS

    By admin
    January 26, 2021
  • How to add a server application written in UNIGUI to startup?

    By admin
    January 27, 2021
  • Amazing Cross Platform Email App Sample In Delphi 10.4.1 FireMonkey For Android And IOS

    By admin
    August 13, 2020
  • Critical Update Available For Delphi FireMonkey 10.4.1 On Android, IOS, OSX, Windows, And Linux

    By admin
    September 4, 2020
  • Setting up the IDE for your first Android Application in Delphi

    By admin
    September 7, 2020

Follow us

Find us on Facebook

© Copyright Delphifan Forum. All rights reserved.