[addinall]

Moving the CSS down one level into the individual
[Song List Group]->Option Wrapper
Fixes the margin AND sizes the box correctly

It breaks this

border: 1px solid #222;

I can live with no borders on the elements, but it looked better.

Cheers,
Mark.

[addinall]

Actuall Ally, I inserted that CSS in the CSS element of the

Song List->Group Elements Wrapper

And it DID fix the margin error, but somehow overwrote the display size, i.e. I have it set at 500px but when this code is entered it just keep on drawing until the end of the list.

I’ll stick the code in some other places and see what happens!

Cheers,
Mark.

[addinall]

Thanks Ally. Yeah that $map could com in handy on a number of applications. When I was writing the Javascript to handle each for element I was wishing “I wish I could GLOB the namespace like Perl”, so I googled it and discovered $map. Very happy with that function!

The CSS fix worked a treat! Thanks! I understand what was happening now.

I downloaded the export file, and it is being exported in the correct order.

I’ll mail it. Still displays in the wrong order %-/

Dunno.

Thanks for all your help,
Cheers,
Mark.

[addinall]

Hi thanks again Ally. I got the sooper dooper automagic playlist construction finished. I discovered jQuery map which saved me a lot of coding and duplication, so, even ‘though that wasn’t an issue for you to resolve, it is resolved, here is the code if you want to share it with your users.


<!-- This is the custom Javascript (jQuery) that will allow two
dynamic forms to interact with each others DOM elements.
Each form, and each element in a form has a unique DOM id.
This id is used to manipulate the DOM when applying conditional
manipulation of the visible form elements.
Mark Addinall. February 2013 -->

<script type="text/javascript">

// Ths script relies on jQuery already being loaded
// it is, probably more than once which is a worry
//
// There are any number of check boxes in this system that
// appear or dissapear in and out of the visible DOM depending
// on the value of a radio selection in the same form.
//
// Even 'though the checkbox portions of the for appear
// and re-appear, the checked-unckecked values are
// maintained.
//
// when a check box is clicked (to check or uncheck, this
// script rebuilds the value of the Play List textarea
// from the values in the visible and the hidden checkboxes.
//
// Mark Addinall. March 2013
// function build() - uses map to look at all elements in a div
//
// This started in life as about 300 or so lines. I discovered
// map.
//
// What happens now is real magic. Each checkbox in a group
// within a form is accessed by map whether it is visible by
// the DOM or not. The textarea in another page is rebuilt
// based on the values of all of the checked items in each of
// the checkboxes within the group. This has some very real
// benefits. Getting rid of 300 lines of code is always a plus.
// Also, this way the user (ungrateful bastard) can delete, add,
// modify checkboxes in the group with aplomb, and never darken my
// doorstep again....
//

//----------------------------------
jQuery(document).ready(function ($) {

var $textarea = $('.iphorm_3_9'); // this is a text area
// second WINDOW
// (widget)
//----------------
function build() {

// this is the function that does the work
// of interrogating ALL the checkboxes that
// are included in the system
//
// map returns an ARRAY of object values
// (much like Perl

var text_boxes = $.map($('input:checkbox:checked'), function(e, i) {

return e.value;
});

// OK, we now have the array containing the values
// from ALL the checkboxes, from these values we
// build up a text area that is in another form
// on another screen (WIDGET area)

$textarea.val('My selected playlist is: \n\n' +
text_boxes.join('\n'));
}

// first time in, check if there are any persistent
// values left in the checkboxes. Customer may
// have timed out or refreshed for some reason

build();

// OK. We are only using checkboxes for ONE
// form for ONE function in this system, so the
// level of granularity can be quite broad.
// iphorm-element-checkbox is enough

$('.iphorm-element-checkbox').on('click', build);
});

</script>


It might me me being thick, but I don’t really understand what you just told me!! Grey hair, holes in Brain 😉

At the moment we have Page -> Contact
Then some of our conditional logic
(if we are on the Contact Page, show the Widget that contains QuForm ‘Play List’)
In Play list we have a HTML area that is static up the top of the form
Then a Radio button SELECT that is also static
Then a series of Check Box INPUT areas that are swapped in and out of the visible DOM by your conditional logic that is described in
Group Song List
and the first Check Box set is in
50s and 60s
This area has conditional logic applied through the wp-admin area of yours that describes
SHOW this field IF type === ’50s && 60s’

And so on for the dozen lists of SUBTYPES of TYPES of music

Seemed logical enough and works really well.
I was going to write exactly the same thing myself so $30 was well spent. No complaints here!

I can’t see where to alter the granurality of the control?

Looking at the CSS and HTML produced one segment looks the same as the next, although something basic must be going on as it is not erratic. It gains a line space for every section.

So no sorry. I don’t understand.

Also, in the Form builder, the group that is Weddings is BELOW New Releases, but displays ABOVE New Releases.

I thought it might have something to do with the ordinality of the id, viz. New Release is _32 and Weddings is _31, but checking the rest, the ids are not in any order, ie. Rock is _5 and displays BELOW Party Anthems which is _32 (these two are displayed in the order shown in the admin section)….

Getting close. I am going to have a go at the conditional Ajax read, but as you mentioned, that is a BIG job, so for now we cut the amount of data down to semi-realistic levels.

Everything else is resolved as far as I am concerned. None of my queries were actually the fault of your plugin.

Cheers,
Mark.

[addinall]

Thanks Ally. I got the mail working. Owners of the Holy Box were telling fibs about what PHP libraries were loaded, so all of that is fine.

PS. Thecolour design and general glariness on that site does not belong to me spititually now physically!!! I need to wear sunglasses to test it.

I figured the Ajax call would be my next move, however before I embarked on that trip I just thought I’d check with the experts! I have been coding for 32 years now and frankly getting sick of it, so I look for short cuts.

I mentioned to the owner that having several gazillion options would slow the thing down. I didn’t quite realise by how much.

Thanks again,
Mark.

[addinall]

Submit Button Outer Wrapper CSS

display: none;

AH HA!

Sorry again 🙂

[addinall]

HOOT!!! I’ll post it up when I get it to work! Mucho grassy-arse from me 🙂

Cheers,
Mark.

[addinall]

Thanks for that. I’ll pester the owners of the box.

Cheers,
Mark.

[addinall]

Just looking at your syntax, does that mean that two forms could interact with each other via the unique id?

var $checkboxes = $(‘.iphorm_1_1’), // first form, colum 1
$textarea = $(‘.iphorm_2_2’); // second form, widget area

THAT would be interesting!

Cheers,
Mark.

[addinall]

PERFECT!! I will be buying more than one of these!

One last question, where would be the best place to stick the code? I am a bit of a newbie at WordPress. I know my way around Javascript and PHP well enough!

Very well done. Renewed my faith in plugins() 🙂

Cheers,
MArk.

[addinall]

Hi Ally, nice code BTW.

Since I am still building this site, I stuck a well known mail address into the settings

Type: SMTP
host: smtp.gmail.com
port: 465
sec: SSL
user: addinall.mark@gmail.com
pass: *******

My IMAP engines work from this account and it has been running for a very long time!

It really does not look like your code at all, I was just wondering if anyone else had seen this?

Cheers,
MArk.

[Author]

Posts