Page 1 of 1
Incorrect div -HTMLMobile
Posted: Tue Jun 10, 2025 6:04 pm
by Ken
If you use code:
Code: Select all
If ContainerMobile(#PB_Any, #PB_Mobile_Page)
HtmlMobile("<div class=" + Chr(34) + "card" + Chr(34) + ">")
HtmlMobile("<h2 class=" + Chr(34) + "card__title" + Chr(34) + ">Card Title</h2>")
HtmlMobile("<div class=" + Chr(34) + "card__content" + Chr(34) + ">Lorem ipsum dolor sit amet.</div>")
HtmlMobile("</div>")
CloseMobileContainer()
EndIf
You get HTML:
Code: Select all
<div class="card"></div>
<h2 class="card__title">Card Title</h2>
<div class="card__content">Lorem ipsum dolor sit amet.</div>
You would think you get:
Code: Select all
<div class="card">
<h2 class="card__title">Card Title</h2>
<div class="card__content">Lorem ipsum dolor sit amet.</div>
</div>
Re: Incorrect div -HTMLMobile
Posted: Tue Jun 10, 2025 8:39 pm
by Peter
HtmlMobile() attempts to repair defective HTML.
Therefore it converts <div class="card"> to <div class="card"></div>
Workaround:
Code: Select all
If ContainerMobile(#PB_Any, #PB_Mobile_Page)
Html.s = "<div class=" + Chr(34) + "card" + Chr(34) + ">" +
"<h2 class=" + Chr(34) + "card__title" + Chr(34) + ">Card Title</h2>" +
"<div class=" + Chr(34) + "card__content" + Chr(34) + ">Lorem ipsum dolor sit amet.</div>" +
"</div>"
HtmlMobile(Html)
CloseMobileContainer()
EndIf
P.S.: You can also write it like this:
Code: Select all
Html.s = ~"<div class=\"card\">" +
~"<h2 class=\"card__title\">Card Title</h2>" +
~"<div class=\"card__content\">Lorem ipsum dolor sit amet.</div>" +
~"</div>"
Re: Incorrect div -HTMLMobile
Posted: Wed Jun 11, 2025 5:50 am
by Caronte3D
I think would be better if the HtmlMobile write the code as is.
This way we can do things like wrap a fragment of SB code like this:
Code: Select all
HtmlMobile("<div class=" + Chr(34) + "card" + Chr(34) + ">")
...
SB code
...
HtmlMobile("</div>")
I miss that feature many times.
Also would be nice if SB add a default ID to elements, so we can access easy from JS side without have to add it ourselves.
Re: Incorrect div -HTMLMobile
Posted: Wed Jun 11, 2025 12:42 pm
by Quin
Caronte3D wrote: Wed Jun 11, 2025 5:50 am
Also would be nice if SB add a default ID to elements, so we can access easy from JS side without have to add it ourselves.
+100
Would be super nice.
Re: Incorrect div -HTMLMobile
Posted: Wed Jun 11, 2025 1:26 pm
by Fred
It's the browser which autofix this, when using .append() in jQuery() or raw innerHTML +=.
More info here:
https://chat.deepseek.com/a/chat/s/6c0c ... cc065567f6
Re: Incorrect div -HTMLMobile
Posted: Wed Jun 11, 2025 1:55 pm
by Quin
Your link doesn't work Fred, but I did find
this and
this, which confirms your information.
Re: Incorrect div -HTMLMobile
Posted: Thu Jun 12, 2025 5:27 pm
by Ken
Thanks Peter for the workaround. It did work well.
I also did test with original HTML using ajax.
If you have in root file test.html and it has this content:
Code: Select all
<div id="mytest">
<h5>Spiderbasic is nice</h5>
<script>
function myfunc(){
var mytext = 'Spiderbasic is very nice';
return mytext
}
</script>
</div>
In Spiderbasic app:
Code: Select all
If ContainerMobile(#PB_Any, #PB_Mobile_Page)
HtmlMobile("<div id=" + Chr(34) + "result" + Chr(34) + ">")
HtmlMobile("<script>$(" + Chr(34) + "#result" + Chr(34) + ").load(" + Chr(34) + "test.html#mytest" + Chr(34) + ");")
ButtonMobile(0, "Run myfunc")
CloseMobileContainer()
EndIf
Procedure MobileEvents()
Select EventMobile()
Case 0
!alert(myfunc());
EndSelect
EndProcedure
BindEvent(#PB_Event_Mobile, @MobileEvents())