As per title, is it possible to pass a JSON body along with hx-post through an attribute? Or do I have to make it a form to pass data?
Yes, with the official json-enc extension, which "encodes parameters in JSON format instead of url format."
https://htmx.org/extensions/json-enc/
Usage
<div hx-post='/test' hx-ext='json-enc'>click me</div>
Related
I am writing a custom TagHelper that should change its behavior based on what child elements its owner tag has. This will be used for substituting custom html elements in a localized string.
Here's a simple example of what I'm trying to do:
<h2 locale-key="Hello, %1!">
<span class="bold" locale-parameter="1">#userName</span>
</h2>
In the example above, the TagHelper for LocaleKey will change the content of the <h2> tag to a localized string. If this is a simple string with no parameters, then I can just simply use output.Content.SetHtmlContent() in the TagHelper to set the h2's content to the string. However in this case, the localized string has a parameter (%1), and I want the corresponding child element (<span parameter="1">) to be substituted in the final output. So the final rendered html would look like this:
<h2>Hello, <span class="bold">Lázár Zsolt</span>!<h2/>
To achieve this, I should be able to see all the child elements in the DOM from the LocaleKey TagHelper, so I can generate the correct HTML code. In the TagHelper's ProcessAsync method I can access the TagHelperContext and the TagHelperOutput, but I couldn't find any information about child elements in either of these objects while debugging. Is this possible somehow?
Another approach is to leave the string as is, with the %1 parameter key, and then use the child ParameterTagHelper to substitute itself into the parameterized string. To do this, I'd have to see the siblings of the current tag from the TagHelper.
Recursion would also be fun (e.g. the <span> is also localized and has its own parameters), but for the scope of this question, I'd be happy if I could get this to work without recursion.
I posted too soon again... There is a GetChildContentAsync() method in TagHelperOutput that will... get the child content asynchronously.
I can't validate script tag with attribute nomodule.
I am using odoo framework which is a python backend. It is using lxml to validate xml views or pages. I am building a view with a script tag like:
<script src="src.js" nomodule></script>
It returns an error
lxml.etree.XMLSyntaxError: Specification mandate value for attribute nomodule
However this should be valid according to https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script
Is there a way so that I can make the parser ignore this new attribute or I can bypass such as special data or character.
That's possibly because XML != HTML. And as you can see in the error, it's an XML error.
Is an xml attribute without a value, valid? --> your attribute isn't valid.
You need to specify the attribute value always in xml. Odoo uses xml to produce html, so you need to comply with xml rules. You can do it in this case by specifying an empty value for xml attribute like this:
<script src="src.js" nomodule=””></script>
In my case, I am able to extract viewstate and eventvalidation from response, when the response is like:
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="UGflz/O67VPwTmNdi......"
by giving expression as:
name="__VIEWSTATE" id="__VIEWSTATE" value="(.+?)"
but what is the expression i need to use, when the response is like:
|hiddenfield|__viewstate|koflrijcjafaygr......|
How can I extract this type of response.
use "\" to escape | as
for example to extract viewstate value from
|hiddenfield|__viewstate|koflrijcjafaygr......|
You can use this regular expression __viewstate\|(.+?)\|
You can follow this blogs for such information
I have applied below and make it work
expression: VIEWSTATE|(.+?)|
Template:$1$
Match No: 1
I need get string inside slot before that slot is compiled. Is posibble?
Example
<div>
<slot>
<component-test text="test1"></component-test>
</slot>
</div>
I need as result "<component-test text="test1"></component-test>"
hmm seems its treating slot content html so .. in end result if you need it as string and use later on then you have to do some trick.
first you need to put real string there:
escape('<component-test text="test1"></component-test>');
output : %3Ccomponent-test%20text%3D%22test1%22%3E%3C/component-test%3E
use this output content and put that in slot.
this will treat as string.
now if you need to use that string's real html
convert it back to html using :
unescape('%3Ccomponent-test%20text%3D%22test1%22%3E%3C/component-test%3E')
output :
<component-test text="test1"></component-test>
in this way when you need to transfer html/string you can make it real string then when you need to use/compile make it html again.
Is there any reason why a repeat.for binding would remove attributes from elements inside the repeater?
<div repeat.for="i of model.someArray.length">
<label>Some Array - Index ${i + 1}</label>
<input value.bind="model.someArray[i]" some-custom-attribute="someArray[${i}]"/>
</div>
and that some-custom-attribute is not being output within the repeat, but if I were to remove the string interpolation within there then it outputs fine.
== Edit ==
I have put it in a comment but just to make sure everyone is on the same page, ideally this is the output I expect:
<input value.bind="model.someArray[i]" some-custom-attribute="someArray[0]"/>
The some-custom-attribute is not an aurelia attribute, its pure HTML that a 3rd party JS library uses, so the goal here is to get the textual value of the index into the textual attribute value.
model.someArray.length is a number, not an array. You need to iterate over the array. If you do need the current index, the repeater provides the $index property for you to use.
Your code should look like this:
<div repeat.for="item of model.someArray">
<label>Some Array - Index ${$index + 1}</label>
<input value.bind="item" some-custom-attribute.bind="item"/>
</div>
To answer your original question, doing some-custom-attribute="model.someArray[${i}]" makes Aurelia think you are trying to pass a string value to the custom attribute. You can see that in the following gist: https://gist.run/?id=eed8ac8623ff4749aa5bb93c82a7b1fb I've created a custom element that just pushes whatever value it is given in to an element on the page. Note!!! Don't ever do what I'm doing here! I just did this this way so you wouldn't have to open the js console. To actually get a value passed in, you would need to use some-custom-attribute.bind="item" or (to do things how you are doing things, some-custom-attribute.bind="someArray[i]"