Adding more info to a Node Reference field in node/add/[content type]

There's a right way to do something, a wrong way to do something and the way I did it.

A client needed to have a node with a content type that utilized a related field from another content type using Node Reference fields. Just for the sake of keeping which node type straight we'll say they had a node Y that needed to show node X's title as a field. The problem was in their data node X's title was the same across a number of other nodes of that type. It was very confusing as to which node you were referring to when setting up the Y node. The difference was totally clear on the actual X node because they also included a date field. So something like this:

X node: Ipsum Lorem
X node field "Y Node title"

Y node: Title
Y node: Date...

I don't know of any way of passing both the title and another field through a Node Reference field so it makes sense to the content editor. It was obvious that it needed to be solved for admin usability's sake.

My solution was to create a view of Y nodes in a block showing the Title, Nid, and Year. I created a template file for admin for that particular views field and set it up so that it showed each row as >option<'s in a >select<. I also had the view output the NID as an id attribute for each of the rows. Then I got that block to show on the node/add and node/edit for those content types. Next comes the jquery.

Basically I wanted to have the Y Node title for a specific nid to be selected and it was impossible to easily do that in a node reference field since there were so many titles that were identical. The Node Reference field in the html uses NID as the select Value and the Title as the label. What I did was I created a fake version of the node reference select using the view above that includes both the date, the title, and adds the nid as an html id attribute. Then I used jquery to grab that nid, find it in the actual node reference field and effect the change based on the selected value in the fake node reference field.

jQuery('#block-views-x-node-block').change(function() { // when the user changes the select in the fake option field
var changeval = jQuery('#block-views-x-node-block').find("option:selected").attr("id"); // get the value
jQuery('#edit-field-y-node-und').val(changeval); //set the value in the corresponding actual node reference field

I then used css to hide the real node reference field and style up the block so it is placed and appears as the original one did.