Filter Select Symfony Dom Crawler - symfony

I have html like this :
<select name="MySelect" id="MySelectID">
<option value="0">One</option>
<option value="1">Two</option>
<option value="2">Three</option>
</select>
And i want to get all the option inner text One, Two, and Three
How to do this using Symfony Dom Crawler ?

You can easy use the tag names for the path like $crawler->filter('select > option').
$crawler = new \Symfony\Component\DomCrawler\Crawler('
<select name="MySelect" id="MySelectID">
<option value="0">One</option>
<option value="1">Two</option>
<option value="2">Three</option>
</select>
');
$result = [];
foreach ($crawler->filter('select > option') as $domElement) {
$result[] = $domElement->textContent;
}
// $result is ['One', 'Two', 'Three']

Related

WooCommerce admin orders table - form triggering link

I'm embedding a form in the admin orders list if an order has a certain status. Code:
function bkf_petals_actions( $column, $post_id ) {
$bkfoptions = get_option("bkf_petals_setting");
if ( $column == 'wc_actions' ) {
$order = wc_get_order( $post_id );
if ( $order->has_status( 'new' ) ) {
$nonce = wp_create_nonce("bkf_petals_decision_nonce");
$pid = get_post_meta($post_id,'_petals_on',1);
$url = admin_url('admin-ajax.php?action=petals_decision&orderid='.$post_id.'&petalsid='.$pid.'&outcome=accept&nonce='.$nonce);
$acceptlink = admin_url('admin-ajax.php?action=petals_decision&orderid='.$post_id.'&petalsid='.$pid.'&outcome=accept&nonce='.$nonce);
$rejectlink = admin_url('admin-ajax.php?action=petals_decision&orderid='.$post_id.'&petalsid='.$pid.'&outcome=reject&nonce='.$nonce.'&code=');
echo '<form action="'.$url.'" method="get" id="petals-decision-'.$post_id.'-form">
<input type="hidden" name="action" value="petals_decision" />
<input type="hidden" name="petalsid" value="'.$pid.'" />
<input type="hidden" name="nonce" value="'.$nonce.'" />
<input type="hidden" name="orderid" value="'.$post_id.'" />
<select name="decision" id="petals-decision-'.$post_id.'-select" class="petals-decision" style="width:150px;" required>
<option value="" disabled selected>Select an action...</option>
<optgroup label="Accept">
<option value="accept">Accept Order</option>
</optgroup>
<optgroup label="Reject">
<option value="293">Cannot deliver flowers</option>
<option value="294">Don\'t have the required flowers</option>
<option value="270">We cannot deliver to this location ever</option>
<option value="280">Cannot deliver to this location today</option>
<option value="281">Do not have these flowers but could do a florist choice</option>
<option value="282">Do not have any flowers to meet delivery date</option>
<option value="272">Need more information to deliver this order</option>
<option value="283">Do not have this container but could do with a substitution of container</option>
<option value="273">Do not do this product ever</option>
<option value="274">There is a problem with this address</option>
<option value="284">This area is restricted, can go on next run but not this delivery date</option>
<option value="285">This area is restricted and can\'t be delivered until next week</option>
</optgroup>
</select>
<input type="submit" />
</form>';
}
}
}
It's rendering as you would expect visually:
Image of rendered form
Here's my problem - as soon as you click on the select field to drop down its options, it triggers the underlying link of the whole row and navigates to the order edit page.
Any ideas? Am I missing something?
#martin-mirchev hit the nail on the head - need to set the z-index of the <select> element to at least 20ish

ASP.NET Web Pages with Razor

how to get the name of select tag and use to if condition here is my code:
#{
var size="";
if(Request.Form["cboSize"] == "Extra Small (XS)"){
size = "Extra Small (XS)";
}
...
}
<select name="cboSize">
<option value="xs">Extra Small (XS)</option>
<option value="s">Small (S)</option>
<option value="m">Medium (M)</option>
<option value="l">Large (L)</option>
<option value="xl">Extra Large (XL)</option>
</select>
You need to wrap your select node in a form to get its value from Request.Form["cboSize"]:
<form method="POST">
<select name="cboSize">
<option value="xs">Extra Small (XS)</option>
<option value="s">Small (S)</option>
<option value="m">Medium (M)</option>
<option value="l">Large (L)</option>
<option value="xl">Extra Large (XL)</option>
</select>
<input type="submit" />
</form>
Then in your code:
public async Task<IActionResult> OnPostAsync()
{
var size = Request.Form["cboSize"];
//do something with it asyncronously
return RedirectToPage($"/Details/{size}");
}

Initiate a template iteration in Meteor

Rather than loading a new template, is there a way to force Meteor to initiate an iteration (using {{#each}}) of an array in Meteor? For example, if the user selects a value in a pull down selector, to then initiate Meteor to iterate through an array within that template to populate another multiple selector list rather than load a whole new template with the new selector list.
Let's say this is within a template:
.
.
.
<form class="input-field col s6 card-selector">
<select multiple">
<option value="" disabled selected>Select Students</option>
{{#each StudentList1}}
<option value= '{{FullName}}'>{{formatName FullName}} ({{Level}}) {{RoomWk1}}</option>
{{/each}}
</select>
</form>
.
.
.
When a user selects a value in a different selector in that template:
<select class="week-selector">
<option value="" disabled selected>Week</option>
<option value="Week1">Week 1</option>
<option value="Week2">Week 2</option>
<option value="Week3">Week 3</option>
<option value="Week4">Week 4</option>
<option value="Week5">Week 5</option>
</select>
it will force a reiteration of the first #each to:
<form class="input-field col s6 card-selector">
<select multiple">
<option value="" disabled selected>Select Students</option>
{{#each StudentList1}}
<option value= '{{FullName}}'>{{formatName FullName}} ({{Level}}) {{RoomWk2}}</option>
{{/each}}
</select>
</form>
It would be more efficient than loading a new template that's the same except for the multi selector values.
Sessions are reactive and you can achieve this by using sessions (check if you have session package).
//we don't want the session value from the previous search/events
Template.templateName.onRendered(function(){
Session.set('sessionName', undefined);
});
//I'd probably use onDestroyed instead of onRendered
Template.templateName.onDestroyed(function(){
Session.set('sessionName', undefined);
});
//template events
'change .week-selector': function(){
var selected = $('.week-selector').find(":selected").text();
Session.set('sessionName', selected)
}
//template helper
StudentList1: function(){
var session = Session.get('sessionName');
if(session !== undefined){
//return some documents using the session value in your find()
} else {
//return documents without session value
}
}
EDIT: I found .text() of the selected option in the event but you are free to return value or do whatever you want with the found value/text.

asp.net mvc dropdownlist option disabled selected

Is there any elegant way to create something like this
<select>
<option value="" disabled selected>Select your option</option>
<option value="1">Option1</option>
</select>
using #Html.DropDownListFor helper in ASP.NET MVC 4?
http://jsfiddle.net/wLAt8/
Unfortunately not. There is no way to add attributes to a SelectListItem, which is what gets rendered as an <option>.
You would need to extend the SelectListItem class, and then extend the DropDownListFor to use it. It is unfortunately not very straightforward... It would have been nice for there to be an Attributes dictionary on SelectListItem for this purpose.
Here is an implementation of a custom attribute being applied:
Adding html class tag under <option> in Html.DropDownList
Here's one way you could do it using tag helpers.
<select asp-for="#Model.Orders.FruitsId" class="form-control">
<option value="">Select a Fruit</option>
#foreach (var Fruit in Model.Fruits )
{
if (barber.Name.Equals("Orange"))
{
<option disabled="disabled" value="#Fruit.Id">#Fruit.Name </option>
}
else
{
<option value="#Fruit.Id">#Fruit.Name </option>
}
}
</select>
After struggling I've done this via js function:
function handleSubAction(select) {
var item = document.getElementById(select);
item.children[0].disabled = true;
item.children[0].hidden= true;
return false;
}
and event handler in HTML:
<body onload="handleSubAction('subAction');"/>

jquery reset conditional filter

I have 2 dropdown lists on my webform and using jquery trying to filter/reset filter 2nd dropdown elements based on 1st dropdown selection.
$(document).ready(function()
{
$('#dropdown1').change(function(e)
{
switch ($(this).val())
{
case "4":
//this removal works
$('#dropdown2').filter(function()
{
return ($(this).val() == 16);
}).remove();
break;
.................
default:
//how would I restore filter here?
}
}
});
Removing part works, so it filters item with no problem, but I have difficulty restoring the filter on dropdown 2 if something else is chosen in dropdown 1. I was trying to use .hide() and .show() instead of .remove() but it doesn't seem to work on IE6 at least.
At the start of your document ready take a copy of the values in dropdown2 like this:
var drp2values = $('#dropdown2').html();
then whenever you want to reset the values in dropdown2 to its original state do this:
$('#dropdown2').html(drp2values);
The actual value in the var will be something like :
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="16">16</option>
just tried it:
This code works:
$(document).ready(function()
{
var drp2values = $('#dropdown2').html();
$('#dropdown1').change(function(e)
{
switch ($(this).val())
{
case "4":
//this removal works... now ;)
$('#dropdown2').find('option').filter(function()
{
alert('in4 filt' + drp2values + $(this).val());
return ($(this).val() == 16);
}).remove();
break;
default:
//how would I restore filter here?
$('#dropdown2').html(drp2values);
}
});
});
With this HTML
<BODY>
<select id='dropdown1'>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
<select id='dropdown2'>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="16">16</option>
</select>
</BODY>
The original code you posted where you said the remove worked, it didnt remove the individual option with value 16, it removed the entire dropdown as you were not geting the options before you filtered, you were removing the dropdown :)
Hope this helps.

Resources