Atozed Forums
How to read formControlRange Value after pressing a button - Printable Version

+- Atozed Forums (https://www.atozed.com/forums)
+-- Forum: Atozed Software Products (https://www.atozed.com/forums/forum-1.html)
+--- Forum: IntraWeb (https://www.atozed.com/forums/forum-3.html)
+---- Forum: English (https://www.atozed.com/forums/forum-16.html)
+----- Forum: IntraWeb General Discussion (https://www.atozed.com/forums/forum-4.html)
+----- Thread: How to read formControlRange Value after pressing a button (/thread-1648.html)

Pages: 1 2

How to read formControlRange Value after pressing a button - newsanti - 04-30-2020

if we use TIWBS4Region with RawText and Text Property
.............................
<label for="formControlRange">Example Range input</label>
<input type="range" min="1" max="100" value="20" class="form-control-range" id="formControlRange">
..............................
How to read formControlRange Value after pressing a button?
..............................

object IWForm2: TIWForm2
  Left = 0
  Top = 0
  Width = 979
  Height = 438
  RenderInvisibleControls = True
  AllowPageAccess = True
  ConnectionMode = cmAny
  Background.Fixed = False
  LayoutMgr = IWBS4LayoutMgr1
  HandleTabs = False
  LeftToRight = True
  LockUntilLoaded = True
  LockOnSubmit = True
  ShowHint = True
  JavaScript.Strings = (
   
      '$(document).ready(function(){$('#39'[data-toggle="tooltip"]'#39').toolti' +
      'p();});')
  DesignLeft = 2
  DesignTop = 2
  object IWBS4Region2: TIWBS4Region
    Left = 56
    Top = 24
    Width = 825
    Height = 353
    Css = ''
    HeightRender = False
    Text = ''
    WidthRender = False
    BSRegionType = bs4rtContainer
    object IWBS4Button1: TIWBS4Button
      Left = 32
      Top = 176
      Width = 200
      Height = 25
      ScriptInsideTag = False
      OnAsyncClick = IWBS4Button1AsyncClick
      IconOnRight = False
      Caption = 'ReadSlideValue'
      ModalKeyboardEscape = False
      Tooltip.Delay = 0
      Tooltip.Trigger = 'focus hover'
    end
    object IWBS4Region1: TIWBS4Region
      Left = 32
      Top = 35
      Width = 713
      Height = 121
      Css = ''
      HeightRender = True
      RawText = True
      Text =
        '<label for="formControlRange">Example Range input</label>'#13#10'<inpu' +
        't type="range" min="1" max="100" value="20" class="form-control-' +
        'range" id="formControlRange">'
      WidthRender = True
      BSRegionType = bs4rtFormGroup
    end
  end
  object IWBS4LayoutMgr1: TIWBS4LayoutMgr
    Left = 704
    Top = 216
  end
end

RE: How to read formControlRange Value after pressing a button - Alexandre Machado - 05-01-2020

In this same form, add a hidden field to the Form's HiddenField property as:

formControlRange=abcd


in this case, "abcd" is the default value. you can leave it empty too. The name must match the id of the input control.

When the form gets submitted, formControlRange will be one of the request fields, which can be obtained as usual from the WebApplicaiton.Request.Params object.

RE: How to read formControlRange Value after pressing a button - newsanti - 05-01-2020

(05-01-2020, 02:26 PM)Alexandre Machado Wrote: In this same form, add a hidden field to the Form's HiddenField property as:

formControlRange=abcd


in this case, "abcd" is the default value. you can leave it empty too. The name must match the id of the input control.

When the form gets submitted, formControlRange will be one of the request fields, which can be obtained as usual from the WebApplicaiton.Request.Params object.

don't work. Result value is the default .
Changed Value not update to IW_formControlRange Field.
....................................
Hidden Field  name must be IW_formControlRange.
....................................
object IWForm2: TIWForm2
  Left = 0
  Top = 0
  Width = 979
  Height = 438
  RenderInvisibleControls = True
  AllowPageAccess = True
  ConnectionMode = cmAny
  ExtraHeader.Strings = (
   
      '<style>'#13#10'.bootstrap-select.show-tick .dropdown-menu .selected sp' +
      'an.check-mark'#13#10'{'#13#10'  left: 10px;'#13#10'}'#13#10'.bootstrap-select.btn-group' +
      ' .dropdown-toggle .filter-option'#13#10'{'#13#10'    display: inline-block;'#13 +
      #10'    overflow: hidden;'#13#10'    text-align: left;'#13#10'    white-space: ' +
      'normal;'#13#10'    width: 100%;'#13#10'    word-wrap: break-word;'#13#10'}'#13#10'.boots' +
      'trap-select .filter-option'#13#10'{'#13#10'  white-space: normal;'#13#10'}'#13#10'</styl' +
      'e>')
  HiddenFields.Strings = (
    'IW_formControlRange=abc')
  Background.Fixed = False
  LayoutMgr = IWBS4LayoutMgr1
  HandleTabs = False
  LeftToRight = True
  LockUntilLoaded = True
  LockOnSubmit = True
  ShowHint = True
  JavaScript.Strings = (
   
      '$(document).ready(function(){$('#39'[data-toggle="tooltip"]'#39').toolti' +
      'p();});')
  DesignLeft = 2
  DesignTop = 2
  object IWBS4Region2: TIWBS4Region
    Left = 56
    Top = 24
    Width = 825
    Height = 353
    Css = ''
    HeightRender = False
    Text = ''
    WidthRender = False
    BSRegionType = bs4rtContainer
    object IWBS4Button1: TIWBS4Button
      Left = 32
      Top = 176
      Width = 200
      Height = 25
      CustomAsyncEvents = <
        item
        end>
      ScriptInsideTag = False
      OnAsyncClick = IWBS4Button1AsyncClick
      IconOnRight = False
      Caption = 'ReadSlideValue'
      ModalKeyboardEscape = False
      Tooltip.Delay = 0
      Tooltip.Trigger = 'focus hover'
    end
    object IWBS4Region1: TIWBS4Region
      Left = 32
      Top = 35
      Width = 713
      Height = 121
      Css = ''
      HeightRender = True
      RawText = True
      Text =
        '<label for="formControlRange">Example Range input</label>'#13#10'<inpu' +
        't type="range" min="1" max="100" value="20" class="form-control-' +
        'range" id="IW_formControlRange">'
      WidthRender = True
    end
  end
  object IWBS4LayoutMgr1: TIWBS4LayoutMgr
    Left = 704
    Top = 216
  end
end
-------------------------------------
unit Unit2;

interface

uses
  Classes, SysUtils, IWAppForm, IWApplication, IWColor, IWTypes, IWVCLComponent,
  IWBaseLayoutComponent, IWBaseContainerLayout, IWContainerLayout,
  IWBS4LayoutMgr, Vcl.Controls, IWVCLBaseControl, IWBaseControl,
  IWBaseHTMLControl, IWControl, IWBS4CustomControl, IWBS4CustomInput, IWBS4Input,
  Vcl.Forms, IWVCLBaseContainer, IWContainer, IWHTMLContainer,
  IWHTML40Container, IWRegion, IWBS4Cal, IWBS4CustomRegion, IWBS4InputForm,
  IWBS4Controls, IWBS4Flexbox, IWBS4Region, IWBS4Button,
  IWHTMLTag;

type
  TIWForm2 = class(TIWAppForm)
    IWBS4LayoutMgr1: TIWBS4LayoutMgr;
    IWBS4Region2: TIWBS4Region;
    IWBS4Region1: TIWBS4Region;
    IWBS4Button1: TIWBS4Button;
    procedure IWBS4Button1AsyncClick(Sender: TObject; EventParams: TStringList);
  private
  public
  end;

implementation

{$R *.dfm}

procedure TIWForm2.IWBS4Button1AsyncClick(Sender: TObject;
  EventParams: TStringList);
var
  S,N: String;
  oApp: TIWApplication;
begin
  S:='';
  N:='IW_formControlRange';
  oApp:=WebApplication;
  oApp.ShowMessage(oApp.Request.Params.Text);

  if oApp.Request.HasField(N)then
    oApp.ShowMessage(oApp.Request.GetQueryFieldValue(N))
  else
    oApp.ShowMessage(N+' Not Found.');
end;


initialization
TIWForm2.SetAsMainForm;

end.
-----------------------------------------------------
callback=IWBS4BUTTON1.DoOnAsyncClick IW_Action= IW_ActionParam= IW_AjaxID=15883695805240 IW_FormClass=TIWForm2 IW_formControlRange=abc IW_FormName=IWForm2 IW_height= IW_Offset= IW_SessionID_=CNPgn5l~BnnMewHiSRvX2G7BU~W IW_TrackID_=1 IW_width= IW_WindowID_= modifiers= which=0 x=43 y=15
------------------------------------------------------

RE: How to read formControlRange Value after pressing a button - jeroen.rottink - 05-02-2020

I never used the combination from HiddenFields with controls like Alexandre suggested. Didn't get that working either.
Following is what I use and works.

Code:
// btnCheck2.ScriptEvents.onClick
document.getElementById("HIDDEN_signature").value = "something";
AddChangedControl("HIDDEN_signature");

procedure TIWForm1.IWAppFormCreate(Sender: TObject);
begin
  HiddenFields.AddPair('signature', '');
end;

procedure TIWForm1.btnCheck2AsyncClick(Sender: TObject; EventParams: TStringList);
var Signature: string;
begin
  Signature := HiddenFields.Values['signature'];
  if not Signature.IsEmpty
  then WebApplication.ShowNotification('Signature received')
  else WebApplication.ShowNotification('No signature...');
end;


RE: How to read formControlRange Value after pressing a button - newsanti - 05-02-2020

The objective is to read values from RangeSlideInput (0-100) then assign to the value of HiddenField and return the server.
Now, I can read the value from HiddenField according to the instructions. But is the default
Not a value of 0-100 of RangeSlideInput status.

RE: How to read formControlRange Value after pressing a button - jeroen.rottink - 05-02-2020

Do you mean you want to inform the server on a range value change? And the server has to receive the current value of the range <input>?

RE: How to read formControlRange Value after pressing a button - Alexandre Machado - 05-02-2020

Please add the name attribute to the input field, the same as ID, example:

<input id="formControlRange" name="formControlRange">

RE: How to read formControlRange Value after pressing a button - newsanti - 05-03-2020

(05-02-2020, 11:15 PM)Alexandre Machado Wrote: Please add the name attribute to the input field, the same as ID, example:

<input id="formControlRange" name="formControlRange">
Missing input Name. Yes! Work fine!
Thank you very much for helping.
------------------------------------------------------------------
<label for="formControlRange">Example Range input</label>
<input type="range" min="1" max="100" value="20" class="form-control-range" id="IW_formControlRange" name="IW_formControlRange"  >
-----------------------------------------------------------------
procedure TIWForm2.IWAppFormCreate(Sender: TObject);
begin
  HiddenFields.AddPair('IW_formControlRange','');
end;
-----------------------------------------------------------------
procedure TIWForm2.IWBS4Button1AsyncClick(Sender: TObject;
  EventParams: TStringList);
var
  S: String;
  oApp: TIWApplication;
begin
  oApp:=WebApplication;
  oApp.ShowMessage(oApp.Request.Params.Text);

  S:=HiddenFields.Values['IW_formControlRange'];
  if not S.IsEmpty  then 
    oApp.ShowNotification(S)
  else 
    oApp.ShowMessage('No Values');
end;

RE: How to read formControlRange Value after pressing a button - jeroen.rottink - 05-03-2020

Hi Alexandre,

Never knew you could connect plain HTML <input> controls to HiddenFields to get back the value this way.
Is this somewhere documented?

Essential seems:

  • name and id attribute should be the same and start with 'IW_'


RE: How to read formControlRange Value after pressing a button - Alexandre Machado - 05-03-2020

Hi Jeroen,

Id doesn't actually need to start with 'IW_'

To be honest I'd recommend against using it to avoid conflicts with internal IntraWeb stuff which starts with IW_, unless you need it.

The point with IW is: Every hidden field starting with IW_ is automatically submitted to the server. If you need it to be submitted automatically and it is not related to any input field, you can use it, sure.

However, if you have an input HTML field you can give it any name you want and create an input field with the same name. The HTML input needs to have the same name attribute as well. Any input field which has an associated hidden field, the value of that input will also be submitted automatically.