Necesito rellenar una línea de un `input` con otros valores que antes he dado y si puede ser separados por guiones.

<!-- language: lang-html -->

    <!-- jQuery -->
    <script src="https://code.jquery.com/jquery-3.2.0.js"></script>

    <!-- HTML -->
    <table>
      <tr>
        <th style="text-align:left;">Titulo del Documento</th>
        <td><input type="text" name="titulo_documento" id="titulo_documento" value="<?php echo isset($obj_categoria) ? $obj_categoria->__GET('titulo_documento') : ''; ?>" style="width:100%;" required /></td>
      </tr>
      <tr>
        <th style="text-align:left;">Compañia</th>
        <td><input type="text" name="compania" id="compania" value="<?php echo isset($obj_categoria) ? $obj_categoria->__GET('compania') : ''; ?>" style="width:100%;" required /></td>
      </tr>
      <tr>
        <th style="text-align:left;">Codigo del proyecto</th>
        <td><input type="text" name="codigo_proyecto" readonly id="codigo_proyecto" style="width:100%;" required/></td>
      </tr>
    </table>

Tengo esto, pero sólo me recoge un dato de los dos

<!-- language: lang-js -->

    $(document).ready(function() {
      $('#titulo_documento').change(function() {
        $('#codigo_proyecto, #compania').val(
          $(this).val()
        );
      });
    });

Lo que quiero es que lo de dos campos me lo inserte en uno. 

Vale decir: titulo_documento+compania se deben de insertar en codigo_proyecto cada vez que haya una modificación de este mismo.