FoxInCloud
combobox - separator line
Gravatar is a globally recognized avatar based on your email address. combobox - separator line
  Vincent H.
  All
  Oct 31, 2021 @ 12:16am

Hi Thierry,

I would like to add a separator line between the options of my combobox, with "\-", but that has no effect in web mode. How to do ?

Thanks in advance

Gravatar is a globally recognized avatar based on your email address. re: combobox - separator line
  FoxInCloud Support - Thierry N.
  Vincent H.
  Oct 31, 2021 @ 09:43am

Hi Vincent,

Please try this fix

modify command awMenu.prg

&& replace

'<hr>'

&& by

'<hr size class="dropdown-divider">'

&& (one single match)
modify file FoxInCloud.css

// remove this directive:

body.bootstrap .dropdown-menu > li.popup.bar.disabled hr {
  margin-top: 7px;
  margin-bottom: 7px;
  border-top-width: 2px;
}

Gravatar is a globally recognized avatar based on your email address. re: combobox - separator line
  Vincent H.
  FoxInCloud Support - Thierry N.
  Oct 31, 2021 @ 11:08am

Thanks Thierry, but I still have this code for the separation option (of my combobox):

<option selected="" disabled="">&nbsp;</option>
Gravatar is a globally recognized avatar based on your email address. re: combobox - separator line
  Vincent H.
  Vincent H.
  Nov 1, 2021 @ 05:54am

Not so simple apparently ... I'll settle for a "\---" if we don't have better

Gravatar is a globally recognized avatar based on your email address. re: combobox - separator line
  FoxInCloud Support - Thierry N.
  Vincent H.
  Nov 2, 2021 @ 01:41am

Hi Vincent,

Currently, FoxinCloud renders list parts of combobox using the 'stock' HTML select and option tags.

<option> is insensitive to CSS settings such as border, and only accept a string as .innerHTML; eg. in <option><hr></option>, <hr> gets discarded.

So yes, the only solution is to mimic an horizontal line using a sequence of characters, such as -, chr(150) (&ndash;) or chr(151)(&mdash;).

Gravatar is a globally recognized avatar based on your email address. re: combobox - separator line
  FoxInCloud Support - Thierry N.
  Vincent H.
  Nov 5, 2021 @ 03:32am

Hi,

V 3.0.0-beta.5 adds support for separator line in listbox and combobox lists.

This feature is demo'ed on the FoxInCloud Live Tutorial (combobox More…)

Vincent H. kindly reported a bug with this feature…
Please apply the following fix:

modify command awHTML.prg
&& completely replace the following method by this code:


function getHTML_cbo_lst_cOptions && [Internal] {en} .List Items {fr} Items de .List
&& {en} PUBLIC because called by awAJAX.PropChangedHTML_waRowSource()
lparameters ;
  toControl as awLst of aw.vcx;
, tlJS as Boolean; && [.F.] {en} return a JavaScript update instruction

&& 2014-05-03 thn -- {en} changed from hidden to PROTECTED (allows developer to implement a custom behavior in sub-class)
&& 2016-09-21 thn -- {FiC V 2.22.0-beta.7} {en} changed from PROTECTED to PUBLIC -- called by awAJAX.PropChangedHTML_waRowSource()

toControl = Iif(Vartype(m.toControl) == 'O', m.toControl, this.oControl)
tlJS = lTrue(m.tlJS)

LOCAL lcResult as String;
, loException as Exception;
, lcOptions, lcOption;
, liRow, lcItem, lcItem_;
, laColWidth[1], lnColWidth;
, lnCol, liCol;
, lnRow_, lnCol_;
, lcFontStyle;
, lnFontMetric;
, lcJS;
, llRST3;
, lcValue;
, lcCaption, lnCaption;

store '' to lcResult, lcOptions

WITH m.toControl as awLst of aw.vcx

#IF NOT DEBUGMODE && 2017-04-24 thn -- {FiC V 2.25.0-beta.4} {en} get detailed error to solve "Error while mapping form changes into HTML ip_scx: Method or procedure gethtml_cbo_lst_coptions(): error #5 ("Record is out of range") at code line #2,557"
TRY
#ENDIF

llRST3 = .RowSourceType = 3
* assert !(m.llRST3)

* {fr} Si la liste est remplie
IF .T.;
 AND .ListCount > 0;
 AND NOT .ListItem[1] == '.F.' && 2016-10-14 thn -- {FiC V 2.22.0-beta.8} {en} .List[1] attempt to solve "Error while mapping form changes into HTML ip_scx: Method or procedure gethtml_cbo_lst_coptions(): error #5 ("Record is out of range") at code line #2,557"

	* {en} Parse columns width
	lnColWidth = ALines(laColWidth, .ColumnWidths, 5, ',') &&  width of columns in the unit of measurement specified by form.ScaleMode
	for liCol = 1 to m.lnColWidth
		laColWidth[m.liCol] = Cast(m.laColWidth[m.liCol] as I)
	endfor

	lnCol  = Evl(.ColumnCount, 1) && {en} If you set ColumnCount to 0, the first column is displayed based on the RowSource property or on the items added with the AddItem method.
	lcFontStyle = coFontStyle(m.this.oControl)
	lnFontMetric = Fontmetric(6, .FontName, .FontSize, m.lcFontStyle)
	lnRow_ = Alen(.waRowSource, 1)
	lnCol_ = Alen(.waRowSource, 2)

	lcResult = Iif(Empty(.ListIndex), Textmerge([jQuery('#<<.wcID>>').prop('selectedIndex', -1);]), '')
	
	* {fr} Pour chaque élément
	lnCaption = 0
	FOR liRow = 1 TO .ListCount
		IF .T.;
		 AND m.liRow = .ListCount;
		 AND Empty(.Value);
		 AND Empty(.List[m.liRow, 1] + .List[m.liRow, .BoundColumn])
		 
		 	&& {fr} élément vide ajouté par VFP quand .Value est introuvable dans .List[]
		 	lcJS = Textmerge([jQuery('#<<.wcID>>').prop('selectedIndex', -1);])
		 	if m.tlJS
		 		cScriptJSadd(m.lcResult, m.lcJS)
		 	else
			 	this.cScriptJSadd(m.lcJS)
		 	endif

		ELSE

*setStepOn(m.liRow = 17)	
			lcOption = ''
			for liCol = 1 TO m.lnCol
				lcItem  = Evl(.List[m.liRow, m.liCol], ICase(; && {en} Use the List property to retrieve items in the order they are displayed && Iif(m.llRST3, .ListItem[m.liRow, m.liCol]
					m.liRow > m.lnRow_, '',;
					m.lnCol_ = 0, .waRowSource[m.liRow],;
					.waRowSource[m.liRow, m.liCol];
					))
				lcItem_ = Trim(m.lcItem)
				lcOption = m.lcOption + Iif(m.liCol > m.lnColWidth or m.laColWidth[m.liCol] > 0;
					, '|';
						+ cEscaped_Base(m.lcItem_);
						+ ICase(;
							m.lnCol = 1 or m.liCol = m.lnCol,;
								'',;
							m.liCol > m.lnColWidth,;
								Strtran(Strtran(m.lcItem, m.lcItem_), ' ', ' '),; && {en} pad with non-breakable spaces to make columns look equally large
								Replicate(' ', Max(0, Int((m.laColWidth[m.liCol] - Txtwidth(m.lcItem_, .FontName, .FontSize, m.lcFontStyle) * m.lnFontMetric);
									/ Txtwidth(Chr(160), .FontName, .FontSize, m.lcFontStyle) / m.lnFontMetric)));
							);
					, '';
					)
			endfor

			lcValue = Iif(.BoundColumn > 1, .List(m.liRow, .BoundColumn), '')
			lcOptions = m.lcOptions;
			 + Iif(m.tlJS, '', TABUL);
			 + [<option];
			 	+ nEvl(m.lcValue, Textmerge([ value="<<cHTMLattribValue(m.lcValue)>>"]));
				+ Iif(.Selected(m.liRow), [ selected], '');
				+ Iif(Leftc(Cast(ICase(;
					m.liRow > m.lnRow_, '',;
					m.lnCol_ = 0, .waRowSource[m.liRow],; && 2016-12-13 thn -- {FiC V 2.23.0-beta.8} {en} fixed lnCol_ vs lnCol
					.waRowSource[m.liRow, 1];
					) as M), 1) == '\', [ disabled], '');
			 + [>];
			  + Iif(varSet(@m.lcCaption, Ltrim(Evl(Substrc(m.lcOption, 2), ' '), '\')) and varSet(@m.lnCaption, Max(m.lnCaption, Lenc(m.lcCaption))), m.lcCaption, ''); && 2021-11-04 thn -- {FiC V 3.0.0-beta.5} {en} added iif()
			 + [</option>];
			 + Iif(m.tlJS, '', CRLF)
		endif
	endfor
	lcOptions = Iif(m.lnCaption > 2;
	  , Strtran(Strtran(m.lcOptions, '>--</o', '>-</o'), '>-</o', '>' + Replicate('–', m.lnCaption-2) + Replicate(' ', 2) + '</o'); && 2021-11-04 thn -- {FiC V 3.0.0-beta.5} {en} added for separator lines
	  , m.lcOptions;
	  )
endif

lcResult = Iif(m.tlJS;
	, Textmerge([jQuery('#<<.wcID>><<Iif(.BaseClass == 'Combobox' and .Style = 0, "_lst", "")>>').html(<<cLitteralJS(m.lcOptions)>>);]) + m.lcResult;
	, m.lcOptions;
	)

#IF NOT DEBUGMODE && 2017-04-24 thn -- {FiC V 2.25.0-beta.4} {en} get detailed error to solve "Error while mapping form changes into HTML ip_scx: Method or procedure gethtml_cbo_lst_coptions(): error #5 ("Record is out of range") at code line #2,557"
CATCH TO loException
	loException.UserValue = Textmerge([Object: <<.Name>>, .RowSourceType: <<.RowSourceType>>, .RowSource: <<.RowSource>>, row <<m.liRow>> of <<.ListCount>>, col <<m.liCol>> of <<m.lnCol>>, List: <<cListItems(m.toControl)>>])
	THROW m.loException
ENDTRY
#ENDIF

endwith

return m.lcResult
endfunc
Gravatar is a globally recognized avatar based on your email address. re: combobox - separator line
  Vincent H.
  FoxInCloud Support - Thierry N.
  Nov 5, 2021 @ 04:17am

Thanks Thierry,

But now, in the example I sent you, the list is empty. No error message.

Gravatar is a globally recognized avatar based on your email address. re: combobox - separator line
  FoxInCloud Support - Thierry N.
  Vincent H.
  Nov 5, 2021 @ 05:03am

Can't reproduce, even by adding in function getHTML_cbo_lst_cOptions

setStepOn(m.toControl.wcID = 'popfich_scx-listefich')
Gravatar is a globally recognized avatar based on your email address. re: combobox - separator line
  Vincent H.
  FoxInCloud Support - Thierry N.
  Nov 5, 2021 @ 06:03am

It works great, thanks !

Sorry Thierry, I had disabled the Refresh_ code for my tests (which allows me to drag & drop options)

Gravatar is a globally recognized avatar based on your email address. re: combobox - separator line
  FoxInCloud Support - Thierry N.
  Vincent H.
  Nov 5, 2021 @ 06:56am

OK, fine, thanks for the feedback

© 1996-2021