Migrating a SharePoint site from on-premise 2013 to SharePoint Online. Ran across a page that does not work after migration. Key point is that I cannot figure out what List Column is referenced in document.GetElementByID command in existing code
I know how to determine internal name of field, but not the actual ID.
function PreSaveAction(){
disposition = document.getElementById("ctl00_ctl32_g_6b054a37_d068_47a5_930e_0789f69b5ab1_ff51_ctl00_DropDownChoice");
if (disposition.options[disposition.selectedIndex].value != "Withdrawn"){
disposition.options[disposition.selectedIndex].selected = "";
}
for (i=0;i<disposition.options.length;i++){
if (disposition.options[i].value == "Withdrawn"){
disposition.options[i].selected = "selected";
}
}
return true;
}
It appears that if I determine the List Column the above is referring to in getElementByID, I need to find the same ID for the List Column in the destination List/Site. I would then update the code to use THAT id.
Just a little lost on how to determine the ID of List Columns.
Thanks in advance for any suggestions.
JS has two method to get element reference, document.GetElementByID("el_id") and document.GetElementByName("el_name"). Your tag will look like <select id="mySelect"> or <select name="mySelect">.
Do a search for your id in your main pages and in all the included script files. If you can't find it, their is two possibility, the id are auto generated by a dev tool or SharePoint and do not match any more or everything is the same and the page did not work in the old environment in the first place witch is often the case.
As a dev guy, you have to remember that everybody lie but computers do exactly what the code says :-)
Related
I'm hoping to select a particular Region to highlight on the page load based on the link the user follows to get to that page. This is a drill-down report with multiple options, so the goal is to have all options available but focus on the one the user selected to reduce the number of times a user has to navigate to/from the base report to the drill-downs.
Currently, I'm trying to implement this solution https://svenweller.wordpress.com.../, further explained in an Oracle Community discussion here: https://community.oracle.com/..., but it is not working for me.
What I have now is similar to what is shown in those examples, and for now I'm just trying to link to a static Region Display Selector (RDS) tab (the goal will be to have the selected Region be dynamic based on which link is clicked in the feeder page, but I'm clearly not there yet).
I have a Dynamic Action set to fire on Page Load event, and a True action that executes JavaScript code and uses the JavaScript in the example (both with and without the Timeout function suggested in the Oracle thread). I have set Static IDs for the RDS and Region, but when I load the page the RDS still defaults to Show All (or the first region if Show All is off).
Can someone help me understand what I'm doing wrong?
Thanks.
let sesStorage = apex.storage.getScopedSessionStorage({
useAppId:true,
usePageId:true});
setTimeout(sesStorage.setItem( "tabs.activeTab", "#R3" ) { apex.region("tabs").widget().aTabs("getTabs")["#R3"].makeActive();}, 300);
\\version without setTimeout
let sesStorage = apex.storage.getScopedSessionStorage({
useAppId:true,
usePageId:true});
sesStorage.setItem( "tabs.activeTab", "#R3" );
I have done something like this in the past. Create a hidden variable on the page P1_TEST, make sure to set the value not to be protected.
You will need to set the value of that variable when the link is clicked.
Then you need to add static IDs TAB1, TAB2 etc. to the tabs of you region display selector.
Then add a DA on Page Load:
if (apex.item("P1_TEST").getValue() === "Value1"){
$(".apex-rds [href='#TAB1']").trigger('click');
} else if (apex.item("P1_TEST").getValue() === "Value2"){
$(".apex-rds [href='#TAB2']").trigger('click');
}
I'm using APEX 5 page to show a classic report region, I want to hide this region when no data found.
I used javascript code in Page HTML Header but it's not working:
<script type="text/javascript">
var has_rows = document.getElementById('news_region').rows;
if (has_rows==0){
$("news_region").hide();
}
</script>
Well, a simple option is to use region's "Server-side condition" whose type is "Rows returned", while the SQL query is just the same as report region's query.
It works OK, no doubt in that, but I don't know it'll behave when the query is heavy (returns a lot of rows, selects from huge tables and stuff). Though, I presume it won't cost much to try it.
I'm developing a Woocommerce theme for one of my clients.
For this project, I needed to clone the cart form (on product pages) in order to display it in another place on the page.
I managed to do this with this piece of code :
$(document).on( 'found_variation', 'form.cart', function( event, variation ) { // found_variation // woocommerce_variation_select_change
$('.fixed-price-right').empty();
$(this).clone().appendTo( '.fixed-price-right' ).each(function() {
$('.product-fixi').scrollToFixed();
});
});
First, on each variation changes, I empty the div in which the form clone will be displayed.
Then, I clone it and made the container div fixed.
The problem is that I get everything except the selected variation value.
Actually, the default selected value got this attribute : selected="selected". But this attribute is not applied to other options.
You can see a living example here: http://www.pro4mance.com.au/product/produrance-energy-gels-2/
If I submit from the cloned form, the product is added but without option.
The weird thing is that if I add manually (from web console) this attr in the right option of the cloned form and then add the product to the cart, the product is added with all the good options.
I don't really know how to force the adding of selected="selected" on each change. Can someone please help me to manage it?
Thanks everyone!
For everyone who need to force the adding of the "selected" attribute on Woocommerce option variables, here's how I did it (using jQuery):
$('form.cart').on( 'change', '.variations select', function( event ) {
$val=$(this).val();
$(this).children('option').each(function(){
$childVal = $(this).val();
if ( $childVal == $val ) {
$(this).attr('selected', 'selected');
} else {
$(this).removeAttr('selected');
}
});
});
Feel free to improve it (that's maybe not the best way to do it).
I think you are going to have to look at the file cart.php within the WooCommerce templates folder. Use that to create your own custom cart file. Just run the loop a second time to get EXACTLY what you want, delivered directly from the server. ref: WordPress -- "the Loop" The actual line of code you are interested in is foreach ( WC()->cart->get_cart() as $cart_item_key => $cart_item ) { For the WooCommerce cart, that's the top of the "loop". Add that line again, with your own customization to match your desired second copy of the contents of the shopping cart...
I'd recommend leaving jQuery out of it...
You obviously don't want to append directly within the WooCommerce package (in case of future updates)... (updates here!)
Wow, that seems very easy...
WooCommerce (and almost all add-ons) provides a templating system.
This means that every element displayed on a WooCommerce page can be
overridden.
This system’s advantage is that you can modify the display of an
element without editing WooCommerce core files (which is absolutely
NOT recommended, if you do so, all your modifications will be lost at
the next WooCommerce update, so just don’t do it). All templates are
located in a woocommerce/templates folder. As explained in our
documentation, all you have to do is to create a woocommerce folder
within your theme’s directory, and in this folder duplicate the files
you’d like to override. Please note that we strongly recommend using a
child theme in order not to lose any modifications during your theme
update.
I am a front-end designer and developer with limited JS and jQuery experience. I always know I could learn more, but time has never allowed for that (I could also be using this as an excuse. ; ) Nonetheless, I have an issue on a website I'm currently developing that I need some JS/jQuery help on.
https://dl.dropboxusercontent.com/u/63777185/screenshot.png
This image represents subproducts on a product page. When a user opens the selection box and selects an option, it doesn't automatically check the checkbox. I was able to find something here on StackOverflow that worked with minor tweaks, but the problem comes when there is more than one product. The script that I was using selected all the checkboxes instead of the unique one that I needed.
Another problem is that this code is dynamically generated, so I don't control the output. So, I thought the best way to tackle this was to do addClass to the elements I needed, with an integer to make it unique (since they need to be unique). From there, I didn't know how to get the two pieces of code to work together. This is horribly wrong and you're free to laugh, but this is what I have:
<script>
$(function(){
$('select').each(function(i,j) {
$(this).addClass('selection'+i);
});
$('input').each(function(i,j) {
$(this).addClass('check'+i);
});
$('.selection'+i).change(function() {
var selected = $('select option:selected');
if (selected.val() == "null") {
$('.check'+i).prop('checked', false);
}
else {
$('.check'+i).prop('checked', true);
}
});
});
</script>
Any help is greatly appreciated! : )
I am building a web-based tool for the role-playing game GURPS. Data is maintained in several XML files that are loaded into arrays. Based on changes the user makes, data is re-populated into various spans, inputs and dropdowns from the arrays. No problem so far.
To give the user more feedback, I have a added an anchor that does a hover pop-up that shows the details of the current weapon. For the initial coding, these values were hard-coded while I worked out the rendering issues. Still no problems yet.
Now I am trying to actually populate the hover pop-up with real data. I can not get it to load the real data into the span! I have debugged the function and am certain that I have extracted the data I want. I have used similar lines of code to populate other parts of the web page.
Specifics: I want to replace the "aa" in the span below:
<span id="weaponName1" name="weaponName1" class="weaponName">aa</span><img src="Images/Firearms/Makarov_Suppressed.jpg">
The code I am using to try to re-populate the span is:
function loadWeaponStats(person, weaponID) {
// Load stats of the current weapon into the "Details" anchor fly-out
for (xx1=0; xx1<WeaponsArray.length; xx1++) {
if (weaponID == WeaponsArray[xx1][0]) {
weaponName = WeaponsArray[xx1][1];
alert("weaponName: "+weaponName+"\nperson: "+person);
$("#weaponName"+person).val(weaponName);
xx1 = WeaponsArray.length; // Kill the loop
}
}
}
The alert() is simply to confirm that I have the correct data. The following line should re-populate the span, but it does not.
All HTML, CSS & JavaScript can be found at GURPS Combat Calculator
Pulling out what little hair I have left.
Thanks
You can also do as below:
$("#weaponName"+person).text(weaponName);
you can't use Val() method here.